当前位置:   article > 正文

vue 中怎么监听屏幕触底事件_vue监听移动端页面滑动,当页面滑动到底部时

vue监听移动端页面滑动,当页面滑动到底部时

项目中有一个表格  , 用原生table写的 , 要做下拉加载功能 , 原理就是当屏幕滚到底部时 , 把pageNo++  , 再触发一次请求数据 , 把请求回来的下一页数据合并到前一页数组中 this.list = this.list.concat(data);

  1. created() {
  2. window.addEventListener('scroll', this.Scrollbottom); //页面加载时监听滚动事件
  3. },
  4. destroyed() {
  5. window.removeEventListener('scroll', this.Scrollbottom) //页面离开后销毁监听事件
  6. },
  7. // methods中
  8. Scrollbottom() {
  9. let scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
  10. let clientHeight = document.documentElement.clientHeight;
  11. let scrollHeight = document.documentElement.scrollHeight;
  12. if (scrollTop + clientHeight >= scrollHeight) {
  13. console.log("滚动到底部了")
  14. this.pageNo++
  15. console.log(this.pageNo);
  16. this.fetchData()
  17. }
  18. },

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/花生_TL007/article/detail/532720
推荐阅读
相关标签
  

闽ICP备14008679号