国产成人精品亚洲777人妖,欧美日韩精品一区视频,最新亚洲国产,国产乱码精品一区二区亚洲

您的位置:首頁技術(shù)文章
文章詳情頁

解決vue 使用setTimeout,離開當(dāng)前路由setTimeout未銷毀的問題

瀏覽:104日期:2023-01-02 08:44:01

問題:

從第一個頁面跳轉(zhuǎn)到第二個頁面后,如果停留在第二個頁面,定時器還在運行。如果在兩個頁面之間來回跳轉(zhuǎn),跳轉(zhuǎn)時間小于定時器的間隔時間時,也會出現(xiàn)重復(fù)創(chuàng)建setTimeout的情況。

原因:

當(dāng)我們刷新頁面時,會將當(dāng)前頁面之前創(chuàng)建的setTimeout以及其他定時器都清除掉,但是僅僅是路由切換是不會清除的。

data () { return { ct: null }},methods: { start() { this.ct= setTimeout( () => {that.countdown(end)}, 1000) } end() { clearTimeout(this.ct); //清除 }}

setInterval()計時也需要clearInterval()來清除

補充知識:小記VUE下setTimeOut和setInterval遇到的問題

相信大家對著兩個函數(shù)都陌生,就是一個定時器,setTimeOut只執(zhí)行一次,而setInterval會重復(fù)執(zhí)行

需要注意的是:在setInterval不用的時候一定要用clearSetInterval關(guān)閉定時器。

說一下最近開發(fā)中遇到的問題,我是用vue開發(fā)的,順便記錄這個錯誤。

我需要輪詢接口,所以使用setInterval。

// 我是想沒2秒執(zhí)行一次myFunc這個函數(shù)。setInterval(this.myFunc(),2000)//某個函數(shù)myFunc () { console.log(123)}

但實際的運行結(jié)果是,只執(zhí)行了一遍,并沒有循環(huán)執(zhí)行。

原因是setInterval接受兩個參數(shù),第一個為要執(zhí)行的函數(shù),第二個為時間(毫秒)。

這里我犯的錯誤是,我寫的是一個函數(shù)的執(zhí)行this.myFunc() 因為加了()是一個執(zhí)行,而不是個函數(shù)。

于是我又改成這樣寫了,在寫個匿名函數(shù),函數(shù)體是我要執(zhí)行的。

setInterval(function () { this.myFunc()},2000)//某個函數(shù)myFunc () { console.log(123)}

理論上這樣是沒問題的,會每2秒執(zhí)行一次this.myFunc(),但卻報錯了。

原因是 老生常談的javaScript 的this 的問題。

因為用的一個function(){} 這里的 獨立的作用域 this指向了全局(這里是window)而且window里沒有myFunc這個函數(shù),所報了錯。

用過vue的朋友應(yīng)該,基本vue中都是this.XXX這樣寫。這里的this是Vue對象。

所以為了使this正確指向vue,我用了ES6的尖頭函數(shù)。

最終

setInterval(() => { this.myFunc()},2000)//某個函數(shù)myFunc () { console.log(123)}

尖頭函數(shù)因為它的特殊性,它的this指向它外層的對象。

其實主要說的是第二個問題,第一個屬于對函數(shù)不熟悉,第二個則是VUE,ES6,this指向綜合的問題。

以上這篇解決vue 使用setTimeout,離開當(dāng)前路由setTimeout未銷毀的問題就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持好吧啦網(wǎng)。

標(biāo)簽: Vue
主站蜘蛛池模板: 宝清县| 石泉县| 大庆市| 泸水县| 伊宁市| 尚义县| 乐昌市| 常宁市| 红河县| 兴业县| 儋州市| 连平县| 金坛市| 芷江| 蒙山县| 内江市| 望都县| 游戏| 江陵县| 富顺县| 垦利县| 万山特区| 喀喇| 界首市| 永春县| 泰安市| 邛崃市| 小金县| 延安市| 镇平县| 遂昌县| 乌拉特前旗| 镇雄县| 丰都县| 神池县| 和平县| 宜兰县| 上虞市| 顺昌县| 独山县| 云龙县|