vue的pc端滚动加载分页

最新推荐文章于 2024-07-24 14:58:19 发布

bug大师

最新推荐文章于 2024-07-24 14:58:19 发布

阅读量1.2k

点赞数

分类专栏： css js

本文链接：https://blog.csdn.net/weixin_43492777/article/details/115478361

版权

JavaScript 防抖滚动加载性能优化延迟执行

关键词由CSDN通过智能技术生成

js 同时被 2 个专栏收录

54 篇文章 0 订阅

订阅专栏

css

15 篇文章 0 订阅

订阅专栏

<div ref='myScrollbar'></div
 handleScroll(){
      if (this.timerLoadMore) {
        clearTimeout(this.timerLoadMore)
      }
      if(this.loading){
        return false
      }
      this.timerLoadMore = setTimeout(() => { // 防抖操作
        let sh = this.$refs['myScrollbar'].scrollHeight // 滚动条高度
        let st = this.$refs['myScrollbar'].scrollTop // 滚动条距离顶部的距离
        let ch = this.$refs['myScrollbar'].clientHeight // 滚动条外容器的高度
        if (st + ch >= sh) {
          //到底了-业务逻辑
          this.params.pageIndex += 1
          if (this.params.pageIndex <= this.totalPage) {
            this.moreData()
          }
        }
      },300)
    },