如果这世上真有奇迹，那只是努力的另一个名字。人生从来没有真正的绝境。无论遭受多少艰辛，无论经历多少苦难，只要一个人的心中还怀着一粒信念的种子，那么总有一天，他就能走出困境，让生命重新开花结果。
在平时的短信登录中，当发送短信验证码后会显示倒计时，那么这个倒计时如何实现呢？
wxml文件
<view class='Form'>
<form bindsubmit="formSubmit" bindreset="formReset" class='forms'>
<view class="fidpas">
<input type="number" class="phonenumber" placeholder="请输入手机号" name="phonenumber" />
<input type="number" class="message" placeholder="请输入短信验证码" name="msg" />
<button class="{{sendmsg}}" bindtap="sendmessg" class='btn'>{{getmsg}}</button>
</view>
<button class="lgbut" formType="submit" type='warn'>下一步</button>
</form>
</view>
js文件
let timeId = null;
Page({
data: {
sendmsg: "sendmsg",
getmsg: "获取短信验证码",
},
sendmessg: function (e) {
var timer=1;
if (timer == 1) {
timer = 0
var that = this
var time = 60
that.setData({
sendmsg: "sendmsgafter",
})
var inter = setInterval(function () {
that.setData({
getmsg: time + "s后重新发送",
})
time --
if (time < 0) {
timer = 1
clearInterval(inter)
that.setData({
sendmsg: "sendmsg",
getmsg: "获取短信验证码",
})
}
}, 1000)
}
},
})
wxss文件
.Form{
margin-top: 80px;
}
.forms input{
padding: 10px ;
}
.phonenumber{
border-bottom: 1px solid #ccc;}
.message{
display: inline-block
}
.btn{
display: inline-block;
font-size: 14px;
}
.forms button{
margin-top: 15px;
}
效果图
本文小程序实现短信登录倒计时到此结束。用这生命中的每一秒，给自我一个不后悔的未来。小编再次感谢大家对我们的支持！
