【elementUi-table表格】 滚动条 新增监听事件; 滚动条滑动到指定位置;

1、给滚动条增加监听

javascript 复制代码
        this.dom = this.$refs.tableRef.bodyWrapper
        this.dom.scrollTop = 0
        let _that = this
        this.dom.addEventListener('scroll', () => {
          //获取元素的滚动距离
          let scrollTop = _that.dom.scrollTop
          //获取元素可视区域的高度
          let clientHeight = this.dom.clientHeight
          //获取元素滚动条的高度
          let scrollHeight = this.dom.scrollHeight

          if (scrollTop + clientHeight == scrollHeight) {
            //不是获取全部数据,而是加载新的数据
          }
          console.log(`scrollTop:  ${scrollTop}`)
          console.log(`clientHeight:  ${clientHeight}`)
          console.log(`scrollHeight:  ${scrollHeight}`)
        })

2、滚动条滑动到指定为止

只需要给scrollTop 赋值就行了

javascript 复制代码
//滚动条滑动到指定位置
this.dom.scrollTop = this.dom.scrollHeight + 300
相关推荐
山楂树の8 分钟前
图像标注大坑:img图片 + Canvas 叠加标注,同步放大后标注位置偏移、对不齐?详解修复方案及亚像素处理原理
前端·css·学习·canva可画
本山德彪10 分钟前
我做了一个拼豆图纸生成器,把照片秒变图纸
前端
DTrader37 分钟前
用TS无法实盘量化? - 实盘均线策略
前端·api
进击的夸父39 分钟前
vfojs:Vue 超集架构,外壳React灵魂Vue
前端
编程老船长40 分钟前
解决不同项目需要不同 Node.js 版本的问题
前端·vue.js
Wect43 分钟前
LeetCode 5. 最长回文子串:DP + 中心扩展
前端·算法·typescript
漫游的渔夫43 分钟前
前端开发者做 Agent:别写成一次请求,用 5 步受控循环防止 AI 乱跑
前端·人工智能·typescript
薛定猫AI2 小时前
【深度解析】Gemma Chat 本地 AI 编程 Agent:Electron + MLX + 开源模型的离线 Vibe Coding 实战
javascript·人工智能·electron
kyriewen2 小时前
Webpack vs Vite:一个是“老黄牛”,一个是“猎豹”,你选谁?
前端·webpack·vite
打小就很皮...2 小时前
html2canvas + jsPDF 生成 PDF 的踩坑与解决方案总结
前端·pdf