微信小程序重新开始语句

Question

问题遇到的现象和发生背景

按照提示做了一个倒计时器的微信小程序，可以开始倒计时以及中途停止，现在想增加一个button的功能是点击“重新开始”按钮可以回到倒计时开始时的样子。

用代码块功能插入代码，请勿粘贴截图

<view class='box' hidden='{{hidden}}'>
  <view class='title'>倒计时器</view>
  <view class='time'>{{num}}</view>
  <view class='btnLayout'>
    <button bindtap='start' disabled="{{btnDisabled}}">开始计时</button>
    <button bindtap='stop'>停止计时</button>
    <button bindtap='return'>重新开始</button>
  </view>
</view>

// index.js

var num = 100; 
var timerSet; 
Page({
  data: {
    hidden: true, 
    num: num
  },
 
  onLoad: function(options) {
    var that = this;
    setTimeout(() => {
      that.show()
    }, 2000) 
  },
 
  show: function () { 
    var that = this;
    that.setData({
      hidden: false 
    })
  },
 
  start: function() { 
    var that = this;
    timerSet = setInterval(() => {
      that.timer()
    }, 1000) 
  },
 
  stop: function() { 
    clearInterval(timerSet) 
  },

  return: function(){//希望在这里加入一个return的功能可以重新开始程序
   
  },
 
  timer: function() { 
    var that = this;
    console.log(num)
    if (num > 0) {
      that.setData({
        num: num-- 
      })
    } else {
      that.setData({
        num: 0
      })
    }
    console.log(num)
  }
 
})

运行结果及报错内容

无法做到重新开始程序

我的解答思路和尝试过的方法

我想要达到的结果

点击重新开始按钮可以让小程序从头开始

Answer 1

data中添加一个initNum保存初始值

  data: {
    hidden: true, 
    num: num,
    initNum: num,
  },

具体逻辑

  return: function(){//希望在这里加入一个return的功能可以重新开始程序
    clearInterval(timerSet) // 如果是从头计时，这行注释掉
    num = this.data.initNum
    this.setData({
      num: num
    })
  },