微信小程式手機驗證碼獲取倒計時 重新整理頁面也會繼續
阿新 • • 發佈:2021-08-30
wx.ml
<view class="item {{change2?'change_border':''}}"> <label for="">驗證碼</label> <input type="testmsg" value="{{testmsg}}" data-index="2" bindblur="nochanegBorder" bindinput="changeValue" bindfocus="changeBorder" placeholder="請輸入密碼" /> <view class="test {{getTest?'':'test_active'}}" bindtap="{{getTest?'':'getTestMsg'">{{getTest?'重新獲取'+waitTime/1000+'S':'獲取驗證碼'}}</view>
</view>
wx.js
onLoad: function (options) { let that = this; let waitTime = wx.getStorageSync('waitTime') let getTest = wx.getStorageSync('getTest')if (waitTime) { that.setData({ waitTime },()=>{ if(waitTime!==0){ that.getTestMsg() } }) } else { wx.setStorageSync('waitTime', 60000) } if (getTest) { that.setData({ getTest }) } else { wx.setStorageSync('getTest', false) } }, getTestMsg() { const that = this; let waitTime = wx.getStorageSync('waitTime'); console.log(waitTime) if (!that.data.getTest) { that.setData({ getTest: true },()=>{ wx.setStorageSync('getTest',true) }) } //傳送驗證碼 if (waitTime == 0) { that.setData({ getTest: false }, () => { wx.setStorageSync('waitTime', 60000) wx.setStorageSync('getTest', false) }) //重新獲取驗證碼 } else { setTimeout(() => { waitTime = waitTime - 1000; that.setData({ waitTime }, () => { wx.setStorageSync('waitTime', waitTime) return that.getTestMsg() }) }, 1000) } }