微信小程序

微信小程序 短信验证码

2022-03-23  本文已影响0人  AAA_si

短信验证码 倒计时90秒 归0后恢复 获取验证码

code.png

1.login.js

data: {
    // 验证码
    code:'', 
    inter:'', // 定时器
    codeshow:true,
    sendTime:90,
},
getCode:function(){
  this.data.inter = setInterval(function() {
    this.setData({
      codeshow: false,
      sendTime: this.data.sendTime - 1
    });
    if (this.data.sendTime < 0) {
      clearInterval(this.data.inter)
      this.setData({
          codeshow: true,
          sendTime: 90
      });
     }
  }.bind(this), 1000);
}

2.login.wxml

<view class="inputCode">
   <input class="code" value="{{code}}" placeholder="请输入验证码" type="number" maxlength="6" />
   <view class="btncode" wx:if="{{codeshow}}" bindtap="getCode">获取验证码</view>
   <view class="btncode" wx:if="{{!codeshow}}">{{sendTime}}s</view>
</view>
上一篇 下一篇

猜你喜欢

热点阅读