溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點(diǎn)擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

vue中怎么監(jiān)聽scroll方法

發(fā)布時間:2021-07-09 14:23:04 來源:億速云 閱讀:164 作者:Leah 欄目:web開發(fā)

本篇文章為大家展示了vue中怎么監(jiān)聽scroll方法,內(nèi)容簡明扼要并且容易理解,絕對能使你眼前一亮,通過這篇文章的詳細(xì)介紹希望你能有所收獲。

問題

今天想在vue的項(xiàng)目里面用下拉加載,然后就直接寫了:

vue中怎么監(jiān)聽scroll方法

但是我發(fā)現(xiàn)我切換路由以后依舊其他頁面也觸發(fā)了scrollHandler函數(shù),然后我想到使用了vue-router做的spa項(xiàng)目,window對象不變的,所以需要在每次使用后銷毀。

解決辦法

我回去看了下vue文檔的生命周期,看到了destroyed,然后直接在這個周期內(nèi)銷毀就可以了。

vue中怎么監(jiān)聽scroll方法

使用throttle出現(xiàn)的新問題

下拉加載一般需要配合throttle限流函數(shù)(原理可以看這里)來避免頻繁觸發(fā),所以優(yōu)化代碼成這樣:

vue中怎么監(jiān)聽scroll方法

然后發(fā)現(xiàn)沒法用removeEventListener了,因?yàn)檫@個函數(shù)第二個參數(shù)不接受匿名函數(shù)。

最后代碼

用一個變量中轉(zhuǎn)下

vue中怎么監(jiān)聽scroll方法

上述內(nèi)容就是vue中怎么監(jiān)聽scroll方法,你們學(xué)到知識或技能了嗎?如果還想學(xué)到更多技能或者豐富自己的知識儲備,歡迎關(guān)注億速云行業(yè)資訊頻道。

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI