input防抖節流之防抖vue實例


節流的應用場景頻繁會在input實時搜索展示相應內容,所以為了避免無線向后端發送請求以下是核心代碼:

對這個input進行節流看下圖

你只需要將this.refreshAll()換成自己要執行的邏輯即可

對於獲取監聽input的值得話在可以有兩種比較合適的方式:1.通過input上添加input事件進行監聽  2.通過watch監聽綁定v-model的input值如下

重點已經說完,說說我遇到了一些坑如果你寫成如下的形式節流會有問題(如下)

或者如下

或者如下:

 

這樣都是清除不了定時器的,所以需要注意!

 

這是我踩過的坑,希望可以幫到大家,一起進步!有什么問題可以回復一起討論!!

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM