鍍金池/ 問答/HTML/ clearInterval 清除定時(shí)器 有時(shí)候會(huì)無效？

clearInterval 清除定時(shí)器 有時(shí)候會(huì)無效？

  methods: {
    async init () {
      await this.getData();
      this.setTimer()
    },
    async getData() {
      //...ajax 獲取數(shù)據(jù)
    }
    async setTimer() {
      this.timer = setInterval(() => {
        this.oldItems = this.items;
        this.aniTimer ? clearTimeout(this.aniTimer) : "";
        if (this.token) {
          this.getData();
          console.log("頁面一刷新了");
        }
      }, 4000);
    }
  },
  async onShow() {
    this.init()
  },
  onHide() {
    clearInterval(this.timer);
    console.log("頁面一 結(jié)束刷新了");
  }

項(xiàng)目中幾個(gè)頁面都是通過Interval 每4秒更新數(shù)據(jù)，每次進(jìn)入頁面都開始Interval，離開頁面都結(jié)束Interval。
但有時(shí)網(wǎng)速比較差時(shí)，跳轉(zhuǎn)到另一個(gè)頁面的后，控制臺(tái)還在不斷輸出"頁面一刷新了"？不知道是什么情況

----------------------------------------------------

第一個(gè)頁面執(zhí)行ajax都是使用同步的（耗時(shí)很長），還沒走到setInterval，就跳轉(zhuǎn)到另一個(gè)頁面，從第一個(gè)頁面離開執(zhí)行onHide時(shí)clearInterval(this.timer) this.timer還沒有設(shè)定，進(jìn)入第二個(gè)頁面還是會(huì)執(zhí)行第一個(gè)頁面的定時(shí)器？這種情況有什么好的解決方法？

回答
編輯回答
檸檬藍(lán)

你到第二個(gè)頁面了,但擬第一個(gè)請(qǐng)求并沒有被取消. 所以當(dāng)?shù)谝粋€(gè)請(qǐng)求結(jié)束時(shí),繼續(xù)執(zhí)行了 this.setTimer().

解決方案:

async setTimer() {
  // 頁面已經(jīng)隱藏了,不設(shè)置 timer.
  if (this._hide) return;

  this.timer = setInterval(() => {
      this.oldItems = this.items;
      this.aniTimer ? clearTimeout(this.aniTimer) : "";
      if (this.token) {
          this.getData();
          console.log("頁面一刷新了");
      }
  }, 4000);
}
onHide() {
 this._hide = true.
},
2017年5月23日 13:02
編輯回答
糖豆豆

沒用過mpvue

2017年3月17日 12:02
編輯回答
近義詞

這是vue嗎？
onShow和onHide什么時(shí)候調(diào)用的？？？

2017年7月31日 02:39