Shulou(Shulou.com)05/31 Report--

Today, the editor will share with you the relevant knowledge about how to realize the countdown function of WeChat Mini Programs. The content is detailed and the logic is clear. I believe most people still know too much about this, so share this article for your reference. I hope you can get something after reading this article. Let's take a look at it.

Code

/ / countdown to 60 seconds function countDown (that,count) {if (count = = 0) {that.setData ({timeCountDownTop: 'get CAPTCHA', counting:false}) return;} that.setData ({counting:true, timeCountDownTop: count + 'get back in seconds',}) setTimeout (function () {count--; countDown (that,count);}, 1000);}

Called where the countdown is needed

Page ({data: {counting:false}, / / generate CAPTCHA generateVerifyCode:function () {var that = this; if (! that.data.counting) {wx.showToast ({title: 'CAPTCHA sent',}) / / start the 60-second countdown countDown (that, 60);}},})

The following is a brief introduction to the implementation of the function.

First of all, the countdown is written on the outside of Page, which is a mistake.

The key to implementing the countdown is the setTimeout method, which is the following code. The setTimeout method can be set to execute a function at a specified time interval. The format of the application is setTimeout (function (), time), function is the corresponding method to be executed, and time is the time interval, where 1000 represents 1000 milliseconds, that is, the countDown method is executed every 1 second.

SetTimeout (function () {count--; countDown (that, count);}, 1000)

The countDown method uses the count field to set the countdown time, for example, 60 seconds here.

That is also passed in the countDown method to update the page using the setData method when the countdown state changes.

In the countDown method, the counting field is used to determine whether the countdown is already in order to avoid repeated countdown.

The countdown is judged by count and exited directly by return.

These are all the contents of the article "how to realize the countdown function of WeChat Mini Programs". Thank you for your reading! I believe you will gain a lot after reading this article. The editor will update different knowledge for you every day. If you want to learn more knowledge, please pay attention to the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.