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è)參考，也希望大家多多支持好吧啦網(wǎng)。