vue3+element-plus, 设置table表格滚动到最底部

表格高度自适应滚动至底部解决方案,

最新推荐文章于 2025-09-11 04:41:44 发布

原创最新推荐文章于 2025-09-11 04:41:44 发布 · 2.4k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#element-plus #vue3

前端专栏收录该内容

10 篇文章

订阅专栏

本文介绍了解决HTML表格在设置height后，随着行数增加如何使其滚动条滚动到最后底部数据的问题，通过JavaScript操作tableScrollEle对象实现自动滚动。

当table设置heigh属性时，希望表格添加行数时，能显示最后底部数据（即表格滚动条，滚动到最底部）
解决方法

const tableListRef = ref();

let table = tableListRef.value.layout.table.refs;
// 获取表格滚动元素
let tableScrollEle = table.bodyWrapper.firstElementChild.firstElementChild;
// 设置表格滚动的位置
tableScrollEle.scrollTop = tableScrollEle.scrollHeight;