欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

淺談vue 組件中的setInterval方法和window的不同

 更新時(shí)間：2020年07月30日 08:39:33   作者：龍旗飄揚(yáng)的艦隊(duì)  
這篇文章主要介紹了淺談vue 組件中的setInterval方法和window的不同，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧

vue組件中，this指向?qū)嵗?，【?shí)例中重寫了setInterval等一整套方法】。所以，千萬不能和 window 下掛載的方法混用

具體不同在于，window.setInterval執(zhí)行完比后返回一個(gè)id，而vue實(shí)例中返回【定時(shí)器對(duì)象】，當(dāng)然該對(duì)象中包含一個(gè)_id的私有屬性

因?yàn)?clearInterval 方法參數(shù)是id，所以最佳實(shí)踐是統(tǒng)一使用 window 的方法，不要使用 vue組件的方法

vue中的定時(shí)器方法，要使用箭頭函數(shù)，不要出現(xiàn) const that = this 的寫法

//正確的用法
mounted() {
 // 如果不加 window ，則會(huì)使用 vue實(shí)例的方法，將無法清除定時(shí)器
 this.timer = window.setInterval(() => {
  this.date = new Date();
 }, 2000);
 console.log(this.timer);//number
},
methods: {
 clearTimer() {
  window.clearInterval(this.timer);
  this.timer = null;
 }
}

補(bǔ)充知識(shí)：vue 切換頁面 setInterval

vue 是單頁面應(yīng)用，路由切換后，定時(shí)器并不會(huì)自動(dòng)關(guān)閉，需要手動(dòng)清除，當(dāng)頁面被銷毀時(shí)，清除定時(shí)器即可。

mounted(){
   clearInterval(this.timer);
   this.setTimer();
  },
  destroyed(){
  clearInterval(this.timer)
 }

以上這篇淺談vue 組件中的setInterval方法和window的不同就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論