监听 el-table 组件滚动条滑动事件

业务需求,需要做上拉加载效果



mounted() {
    // 监听table 滚动条
    let tableBodyDom = this.$refs.table.bodyWrapper
    tableBodyDom.addEventListener('scroll', () => {
      // 滚动条总高度 减去 窗口高度 减去 已卷入的高度 小于 50px 就加载新数据
      if ((tableBodyDom.scrollHeight - tableBodyDom.clientHeight - tableBodyDom.scrollTop) < 50) {
        // 一定要给事件一个节流限制。不然会执行很多次
        if (this.next && !this.loading) {
          this.pageLimit.page++
          this.getData()
        }
      }
    })
  },

你可能感兴趣的:(监听 el-table 组件滚动条滑动事件)