函數多次調用只執行一次的小技巧（微信小程序）

函數多次調用只執行一次的小技巧（微信小程序）

問題由來：案例一：當視頻播放至3分之2後，記錄該用戶爲有效用戶。

問題所在：函數執行判斷多次成功

video.wxml文件代碼如下：

<video bindtimeupdate="play" src="/video/movie.mp4" ></video>

video.js文件代碼如下：

Page({
  data: {

  },
  onLoad: function (options) {

  },
  play(e){
    console.log(e.detail)
    let a=Math.floor(e.detail.duration/3)
    let b=Math.floor(e.detail.currentTime)
    if(a==b){

       console.log("已記錄")
    }
  }
})

微信小程序視頻播放時，每250ms獲取一次當前時間currentTime，當判斷時，a==b的判斷會多次成功，則會打印多次，如下圖：

這導致的結果就是我們會向服務器多次發送記錄請求，那麼我們就需要控制函數多次觸發，但只執行一次請求，針對該情況，解決方案如下：

解決方案：增加新判斷

Page({
  data: {
    //新增
    aa:true
  },

  onLoad: function (options) {

  },
  play(e){
    console.log(e.detail)
    let a=Math.floor(e.detail.duration/3)
    let b=Math.floor(e.detail.currentTime)
    if(a==b&&this.data.aa){
      //新增
        this.setData({
          aa:false
        })
       console.log("已記錄")
    }
  }
})

在data中新增aa:true,雖然a==b條件成立的情況可能有多次，但a==b&&this.data.aa成立的情況只有一次，因爲當console.log("已記錄")執行時，this.data.aa已經爲false，a==b&&this.data.aa不再成立，故達到了函數多次調用，但只執行一次的效果！！

結果如下：

如有更好的方案，請留言探討！！

如有出入，歡迎指正！