微信小程序60秒倒计时

微信小程序发送短信验证码后60秒倒计时功能，效果图：

完整代码

index.wxml

      手机号码:                发送        {{second+"s"}}    复制代码

index.wxss

/**index.wxss**/.userinfo {  display: flex;  flex-direction: column;  align-items: center;}.section {display: flex;margin: 16rpx;padding: 16rpx;border-bottom: 1rpx solid#CFD8DC;} text {  width: 200rpx;} button {  margin: 16rpx;} .sendMsg {  font-size: 12;  margin-right: 0;  padding: 0;  height: inherit;  width: 80rpx;}复制代码

index.js

//index.js//获取应用实例const app = getApp() Page({  data: {    send:true,    alreadySend:false,    second: 60,    disabled:true,    phoneNum:''},  // 手机号部分  inputPhoneNum:function(e) {letphoneNum = e.detail.value    this.setData({      phoneNum: phoneNum    })  },  sendMsg:function() {    var phoneNum = this.data.phoneNum;if(phoneNum ==''){      wx.showToast({        title:'请输入手机号码',        icon:'none',        duration: 2000      })return;    }    //此处省略发送短信验证码功能    this.setData({      alreadySend:true,      send:false})    this.timer()  },  showSendMsg:function() {if(!this.data.alreadySend) {      this.setData({        send:true})    }  },  hideSendMsg:function() {    this.setData({      send:false,      disabled:true,      buttonType:'default'})  },  timer:function() {letpromise = new Promise((resolve, reject) => {letsetTimer =setInterval(        () => {          this.setData({            second: this.data.second - 1          })if(this.data.second <= 0) {            this.setData({              second: 60,              alreadySend:false,              send:true})            resolve(setTimer)          }        }        , 1000)    })    promise.then((setTimer) => {      clearInterval(setTimer)    })  },})复制代码

完整的短信验证码登录实例参考:blog.csdn.net/zuoliangzhu…