【微信小程序】使用setTimeout制作定時器的思路

setTimeout(func, time)可以使得每隔time毫秒就執行一次func函數，常用來做計時器/時鍾。

下面是在微信小程序中的使用思路，只截取了關鍵部分代碼。

var timer; // 計時器

Page({
  // ...省略
  
  // 自定義的開始按鈕
  startBtn: function () {
    console.log("開始按鈕");
    Countdown();
  },

　　// 自定義的暫停按鈕  
 pauseBtn: function () { 
 console.log("暫停按鈕");
    clearTimeout(timer);
 },
});

// 倒計時
function Countdown() {
  timer = setTimeout(function () {
    console.log("----Countdown----");
    Countdown();
  }, 1000);
};

思路：

• setTimeout()延遲指定毫秒數后執行指定函數，可通過遞歸調用setTimeout()來實現各種計時器功能。
• 如果想做每秒鍾刷新一次的時鍾，只需每次執行時間轉換函數並setData更新界面即可。
• 使用clearTimeout("定時器的名字")可以停下指定的計時器。

下面是Javascript關於時間的轉換函數。

// 秒數 --> 時：分：秒
function formatTime(seconds) {
    return [
        parseInt(seconds / 60 / 60), // 時
        parseInt(seconds / 60 % 60), // 分
        parseInt(seconds % 60)       // 秒
    ]
        .join(":")
        .replace(/\b(\d)\b/g, "0$1");
}

另外，做定時重復調用函數的功能時，用setTimeOut()代替setInterval()，因為setInterval()是有誤差的！詳情參考

 

參考資料：

• https://www.w3cschool.cn/xiaochengxu/nsgq1u7h.html