依赖
"vue": "^3.2.45",
"element-plus": "^2.2.21"
组件
<el-table ref="table" :height="tableHeight" :data="list" border stripe > <el-table-column align="center" ></el-table-column> <el-table-column align="center" ></el-table-column> <el-table-column align="center" ></el-table-column></el-table>代码
export default { data() { return{ time:'' } }, computed:{ tableHeight(){ let h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight; return h-28 } }, mounted() { this.autoScroll(); }, beforeUnmount() { if (this.timer) { clearInterval(this.timer); } }, methods:{ autoScroll(init) { this.$nextTick(() => { const t = 50 const box = this.$el.querySelector('.el-scrollbar__wrap') const content = this.$el.querySelector('.el-table__body') this.timer = setInterval(() => { this.rollStart(box, content) }, t) }) }, rollStart(box, content) { if (box.scrollTop >= (content.scrollHeight - box.offsetHeight)) { box.scrollTop = 0 } else { box.scrollTop++ } } }}成果