wxml
<view class="li-send" bindtap="onSend" wx:if="{{send}}">发送验证码</view>
<view class="li-send"wx:else>{{seconds}}s后发送</view>
wxss
/**
* 页面的初始数据
*/
data: {
// 发送按钮显示
send:true,
// 当前倒计时秒数
seconds:"",
// 总秒数
max_seconds:59,
},
/**
* 发送验证码
*/
onSend(){
var that=this;
// 获取总秒数
var seconds=this.data.max_seconds;
this.setData({
// 显示倒计时
send:false,
// 设置秒数
seconds:seconds,
})
// 设置定时器
var t=setInterval(function(){
// 如果秒数小于0
if(seconds<=0){
// 停止定时器
clearInterval(t);
that.setData({
// 显示发送按钮
send:true,
})
// 停止执行
return;
}
// 秒数减一
seconds--;
that.setData({
// 更新当前秒数
seconds:seconds,
})
},1000)
},
效果