The example in this article shares the specific code of the WeChat applet to realize the countdown of the SMS verification code for your reference. The specific content is as follows
initial effect
When the button is clicked, set the effect of prohibiting clicks: as shown below
Not much to say, just go to the code
1. wxml part
<view>
<block wx:if="{
{Num==60 || Num==-1}}">
<button bindtap="countDown">获取验证码</button>
</block>
<block wx:else>
<button disabled='{
{isDisabled}}'>{
{Num}}s后重新发送</button>
</block>
</view>2. js part
// pages/push1/push1.js
Page({
/**
* 页面的初始数据
*/
data: {
timer: "",
Num: '60',
isDisabled:false
},
/**
* 验证码倒计时
*/
countDown: function() {
var that=this
var Num=that.data.Num
var isDisabled=this.data.isDisabled
var timer=setInterval(function(){
Num-=1;
that.setData({
Num:Num,
isDisabled:true
})
if(Num<=-1){
clearInterval(timer)
that.setData({
Num:60,
isDisabled:false
})
}
},100)
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})The above is the whole content of this article, I hope it will be helpful to everyone's study, and I hope you can support me a lot