vue中清除定时器 - WEB前端小菜鸟

  • Z时代
  • 2024-01-10
  • 分类：综合

vue

vue中清除定时器

2018-11-12 14:49 

WEB前端小菜鸟 

阅读(12229) 

评论(0) 

编辑 

收藏 

举报

1.data中定义

timer:90,
timeName:null

点击支付则倒计时按钮出来
 pay(){

this.timeName= setInterval(()=>{
  this.timer--
  console.log(this.timer)
  if(this.timer==0){
    alert(\'时间到返回主页\')
    return
  }
},1000)

}

      beforeDestroy(){
//            清楚定时器
            clearInterval(this.timeName)
      }


--------------------------------------------------------------------

点击取消支付后，计时器暂停


它没有真正意义上的暂停，只有清除之后，在继续

<el-dialog
  :close-on-click-modal  ="false"
  title="提示"
  :visible.sync="cancelDialogVisible"
  width="30%"
  center
  @close=\'closeDialog\'>
  <p style="text-align: center">{{txt}}</p>
  <div class="dialog-div">
    <el-button @click="cancelDialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="sure">确 定</el-button>
  </div>
</el-dialog>

//          关闭模态框的事件，公用的模态框，所有判断小于90s不，小于的话就是这个模态框
          closeDialog(){
            let tt=this.timer //获取当前暂停的时间是多少秒
              if(this.timer<90){
                this.timer=tt//重新给它赋值，然后执行定时器搞定
                this.timeName= setInterval(()=>{
                  if(this.timer==0){
                    this.$router.push(\'/index\')
                    return
                  }
                  this.timer--

                },1000)
              }

          },



  • 分类 Vue

  •  

以上是 vue中清除定时器 - WEB前端小菜鸟 的全部内容， 来源链接： utcz.com/z/376128.html

回到顶部