获取table的滚动距离,需要设置table的高度

2022-06-08  本文已影响0人  Hasan_hs

element-ui

// 获取需要绑定的table
this.dom = this.$refs.table.bodyWrapper
this.dom.addEventListener('scroll', () => {
  // 滚动距离
  const scrollTop = this.dom.scrollTop
  // 变量windowHeight是可视区的高度
  const windowHeight = this.dom.clientHeight || this.dom.clientHeight
  // 变量scrollHeight是滚动条的总高度
  const scrollHeight = this.dom.scrollHeight || this.dom.scrollHeight
  if (scrollTop + windowHeight === scrollHeight) {
    // 获取到的不是全部数据 当滚动到底部 继续获取新的数据
    console.log('scrollTop', scrollTop + 'windowHeight', windowHeight + 'scrollHeight', scrollHeight)
  }
})

Ant Design Vue

//监听滚动距离
this.dom = this.$refs.tableRef.$el.querySelector('.ant-table-body')
this.dom.addEventListener('scroll', () => {
      this.scrollPages = this.dom.scrollTop;
    })
//赋值滚动距离
//this.$refs.tableRef.$el.querySelector('.ant-table-body').scrollTop = this.scrollPages;
上一篇 下一篇

猜你喜欢

热点阅读