微信小程序中setInterval使用的一些問題

1、微信小程序如何取得input框的值

  <input class="carInput" placeholder-style="font-size:26rpx" placeholder='請輸入車輛唯一標識ID' value="{{carId}}" bindinput='getCarId'/>

placeholder-style	可以定義placeholder的樣式
bindinput	可以取到input框的value值

getCarId: function(e) {
    this.setData({
      carId: e.detail.value
    })
}

2、需求：傳給後臺的每個數據段裏面都要跟隨時間，時間1s變化一次

我的解決辦法：每隔1s調用一次組裝函數的數據

 that.setData({
     longPostData: [],
     timer: setInterval(function() {
       buildData(that.data.longPostData, that.data.state, time.formatTime(new Date()))
     }, 1000)
 })

buildData如下：

function buildData(target, data, realTime) {
    return function() {
       console.log(time.formatTime(new Date()))
       console.log(realTime)
       data.time = realTime
       target.push(data)
       return target
    }()
}

控制檯打印的時間爲

注意到：每次的時間都是52秒。涉及到setInterval的異步問題，每次賦值都賦最後一次計算的值。

記住：在小程序當前頁面的OnHide,和OnUnload生命週期的時候，一定要清除定時器，否則會出錯。

setTimeout與setInterval真正的含義如下：

1. setTimeout：在指定的毫秒數後，將定時任務處理的函數添加到執行隊列的隊尾。
2. setInterval：按照指定的週期(以毫秒數計時)，將定時任務處理函數添加到執行隊列的隊尾。

問題所在：

因爲data 是引用的，數組裏面的都是一個引用.不僅time一樣，其他參數也是一樣的。

解決辦法：

（1）用深拷貝，這樣每次都是新的data

（2）記錄上次build 的時間戳，每次build 前檢查超過一秒就重新build

 function buildData(target, data) {
      var dataTemp = JSON.parse(JSON.stringify(data))
      dataTemp.time = time.formatTime(new Date())
      console.log(target)
      target.push(dataTemp)
      return target
 }

 這樣輸出的結果爲：

3、去除tabBar的一項

報錯：pecting 'STRING','NUMBER','NULL','TRUE','FALSE','{','[', got INVALID

是因爲：app.json裏面不能有註釋

4、注意到我們的小程序的速度speed一直爲-1。

我們選用另一種api來採集速度。

 // 更新位置數據
      wx.onLocationChange(
        function(res) {
          console.log(res)
          var latitude = 'state.latitude';
          var longitude = 'state.longitude';
          var speed = 'state.speed';
          that.setData({
            [latitude]: res.latitude,
            [longitude]: res.longitude,
            [speed]: res.speed,
          })
        }
      )