获取验证码倒计时

最新推荐文章于 2024-09-09 15:11:55 发布

痞子Monkey

最新推荐文章于 2024-09-09 15:11:55 发布

阅读量151

点赞数

本文链接：https://blog.csdn.net/weixin_42065713/article/details/84635032

版权

<input name="sms_code" type='number' class='flex-1' placeholder="请输入验证码" />
<button class='btn size-24' type="warn" disabled="{{disabled}}" bindtap="getCode">{{codeTxt}}</button>

const app = getApp();

Page({
  data: {
    disabled:false,
    codeTxt:"获取验证码",
    codeTime:61,
  },

  onLoad(options) {},

  /**
   * 点击发送验证码
   */
  getCode(){
    var self = this, pData = this.data, codeTime = pData.codeTime; 

    //调用获取验证码的接口，如果成功返回验证码{

        wx.showToast({
          title: '发送成功', icon: 'success', duration: 2000
        });
         self.setData({
              disabled: true
        })
        
        //设置一分钟的倒计时
         var interval = setInterval(function () {
              codeTime--;
              self.setData({
                codeTxt: codeTime + 's',
              })
              if (codeTime <= 0) {
                clearInterval(interval)
                self.setData({
                  codeTxt: '重新发送',
                  codeTime: 61,
                  disabled: false,
                })
              }
          }, 1000);

    }
    
    
  },
  
 
})