Vue 頁面滾動事件捕捉不到,觸底更新

 

使用這種辦法始終是沒有觸發

 window.addEventListener('scroll',()=>{  console.log("2")  })

 

然后找一下觸發到了誰在滾動

 

Performance ->點擊錄制 然后滾動你的頁面 ,然后點擊stop 停止錄制⏺,就會生成錄制的數據

 

在Event_log 的搜索項中 搜關鍵字 Scroll 如果沒有 重新錄制一遍,選擇紫色的 然后右邊就找到了滾動的節點

 

找到這個節點 然后加上滾動事件

就可以抓到滾動事件了, Ye

 

然后觸底更新 就需要針對這個元素來進行判斷了(我是抓 m-main 這個class 的)

 

//獲取windows的高度 getWindowHeight() {return document.documentElement.clientHeight;}, //獲取已經滾動的高度 getScrollHeight() {return Math.max(document.documentElement.getElementsByClassName("m-main")[0].scrollTop,window.pageYOffset||0)}, //獲取滾動dom的總高度  getDocumentTop() {return document.documentElement.getElementsByClassName("m-main")[0].scrollHeight},

​

 

//windows高度+已經滾動的高度> 滾動dom總高度 let isBottom = (this.getScrollHeight() + this.getWindowHeight()) >= this.getDocumentTop() if (isBottom){  console.log("觸底更新") }

 

 

 雨雀地址

https://www.yuque.com/yuanminghang/ex83zv/sca6qn