So implementieren Sie einen Bestätigungscode, um einen Countdown-Effekt über das WeChat-Applet zu erzielen

In diesem Artikel wird hauptsächlich der Countdown-Effekt des WeChat-Applets zum Erhalten des Bestätigungscodes ausführlich vorgestellt. Er hat einen gewissen Referenzwert.

Das Beispiel in diesem Artikel wird mit allen auf WeChat geteilt. Der spezifische Code des Applets zum Erreichen des Countdown-Effekts des Bestätigungscodes dient als Referenz. Der spezifische Inhalt lautet wie folgt:

wxml

<button disabled=&#39;{{disabled}}&#39; data-id="2" bindtap="getVerificationCode">
{{time}}
</button>

js

var interval = null //倒计时函数
Page({
 data: {
 date:'请选择日期',
 fun_id:2,
 time: '获取验证码', //倒计时 
 currentTime:61
 }, 
 getCode: function (options){
 var that = this;
 var currentTime = that.data.currentTime
 interval = setInterval(function () {
  currentTime--;
  that.setData({
  time: currentTime+'秒'
  })
  if (currentTime <= 0) {
  clearInterval(interval)
  that.setData({
   time: &#39;重新发送&#39;,
   currentTime:61,
   disabled: false 
  })
  }
 }, 100) 
 },
 getVerificationCode(){
 this.getCode();
 var that = this
 that.setData({
  disabled:true
 })
 },

})

Das Obige habe ich für alle zusammengestellt. Ich hoffe, dass es in Zukunft für alle hilfreich sein wird.

Verwandte Artikel:

Neue Funktionen der Webpack 4.0.0-Beta.0-Version (ausführliches Tutorial)

in vue2.0 Komponente So implementieren Sie Wertübertragung und Kommunikation in

Paging in vue.js implementieren Klicken Sie auf die Seitenzahl, um den Seiteninhalt zu ändern

Das obige ist der detaillierte Inhalt vonSo implementieren Sie einen Bestätigungscode, um einen Countdown-Effekt über das WeChat-Applet zu erzielen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!