uni验证码60秒倒计时


其实要实现这个功能原理非常简单,就是setInterval+setTimeout+clearInterval结合使用,首先在data里定义一个变量second,初始值为60,然后在setInterval里执行每秒减1的操作,setTimeout在60秒后执行clearInterval清除定时器的操作

<view v-if="showText==true" class="send" @click="getCode">发送验证码</view>
<view v-else class="send">{{second}}s重新发送</view>

  data() {
    return {
      second:60,
      showText:true,
    };
 },

getCode(){//倒计时
    this.showText = false
    var interval = setInterval(() => {
        let times = --this.second
        this.second = times<10?'0'+times:times //小于10秒补 0
    }, 1000)
    setTimeout(() => {
        clearInterval(interval)
        this.second=60
        this.showText = true
    }, 60000)
},    

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM