在平时的短信登录中，当发送短信验证码后会显示倒计时，那么这个倒计时如何实现呢？
- 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;} - 效果图
