zoukankan      html  css  js  c++  java
  • vue中清除定时器

    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可随意拖动的弹窗组件
    入园仪式
    Node启动https服务器
    《高性能javascript》阅读摘要
    浏览器HTTP缓存机制
    使用nightwatch进行E2E测试中文教程
    Puppeteer的入门教程和实践
    Spring AOP 笔记
    ApplicationContext国际化的支持
    Spring ApplicationContext中的”事件传递“笔记
  • 原文地址:https://www.cnblogs.com/myfirstboke/p/9946429.html
Copyright © 2011-2022 走看看