Heim  >  Artikel  >  WeChat-Applet  >  Beispiel zur Erläuterung der Countdown-Funktion des WeChat-Applets

Beispiel zur Erläuterung der Countdown-Funktion des WeChat-Applets

小云云
小云云Original
2018-05-15 15:37:275043Durchsuche

Die WeChat-Entwicklung erfreut sich mittlerweile immer größerer Beliebtheit. Die Countdown-Funktion ist eine relativ häufige Funktion. Benutzer müssen sie beispielsweise verwenden, um Bestätigungscodes zu erhalten. Die Countdown-Funktion wird häufig in der Projektentwicklung verwendet. Heute werde ich Ihnen den Implementierungscode der Countdown-Funktion im WeChat-Applet vorstellen. Ich hoffe, er kann Ihnen helfen.

Schauen wir uns einfach den Code an

//倒计时60秒
function countDown(that,count) {
 if (count == 0) {
 that.setData({
  timeCountDownTop: '获取验证码',
  counting:false
 })
 return;
 }
 that.setData({
 counting:true,
 timeCountDownTop: count + '秒后重新获取',
 })
 setTimeout(function(){
 count--;
 countDown(that, count);
 }, 1000);
}

Rufen Sie an, wo ein Countdown erforderlich ist

Page({
 data:{
  counting:false
 },
 //生成验证码
 generateVerifyCode:function() {
  var that = this;
  if (!that.data.counting) {
   wx.showToast({
   title: '验证码已发送',
   })
   //开始倒计时60秒
   countDown(that, 60);
  } 
 },
})

Das Folgende ist eine kurze Einführung in die Implementierung der Funktion

Erster Countdown. Die Methode wird außerhalb der Seite geschrieben.

Der Schlüssel zur Implementierung des Countdowns ist die setTimeout-Methode, die der folgende Code ist. Mit der setTimeout-Methode kann eine Funktion so eingestellt werden, dass sie in einem bestimmten Zeitintervall ausgeführt wird. Das verwendete Format ist setTimeout(function(), time), function ist die auszuführende Methode und time ist das Zeitintervall. 1000 bedeutet hier 1000 Millisekunden, d. h. die countDown-Methode wird alle 1 Sekunde ausgeführt.

setTimeout(function(){
 count--;
 countDown(that, count);
 }, 1000);
  • Bei der CountDown-Methode wird das Count-Feld verwendet, um die Countdown-Zeit festzulegen.

  • Die countDown-Methode verwendet auch die setData-Methode, um die Seite zu aktualisieren, wenn sich der Countdown-Status ändert.

  • Das Zählfeld wird in der countDown-Methode verwendet, um zu bestimmen, ob Der Countdown läuft bereits, um ein wiederholtes Starten des Countdowns zu vermeiden

Das Ende des Countdowns wird anhand der Zählung beurteilt und Sie können den Countdown direkt beenden, indem Sie zurückkehren

Verwandte Empfehlungen:

Countdown-Funktion für Bestätigungscode senden, wenn Sie sich per Mobiltelefon registrieren

JavaScript-Countdown-Timer-Implementierungsmethode

Erstellen Sie eine Vue-basierte Countdown-Demo

Das obige ist der detaillierte Inhalt vonBeispiel zur Erläuterung der Countdown-Funktion des WeChat-Applets. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn