例如,你可以保存滚动条的位置,然后在需要的时候恢复这个位置。这可以通过监听表格的滚动事件,并保存滚动位置来实现。然后,在需要恢复滚动位置的时候,你可以设置表格的 `scrollTop` 属性。 以下是一个简单的示例代码: ```vue <template> <el-table ref="table" :data="tableData" style="width: 100%" @scroll...
1. 确定el-table中滚动条的目标位置 首先,你需要确定滚动条需要滚动到的目标位置。这通常是通过表格中的行或单元格的索引来确定的。例如,你可能想滚动到第10行或包含特定数据的单元格。 2. 使用Vue.js或Element UI的API来操作el-table的滚动条 Element UI的el-table组件并没有直接提供滚动到指定位置的API,但我...
//记录点击行时的 纵轴滚动条位置 let vmEl = this. el const scrollParent = vmEl.querySelector('.el-table__body-wrapper') this.Nowscroll = scrollParent.scrollTop } 六:刷新列表的方法 内 绑定 之前 选中的 页码 行及 滚动条位置 //选中 之前记录的 分页页码 this.current_change(this.LastPageCoun...
},mounted() {// 监听滚动条的位置this.$refs.table.bodyWrapper.addEventListener('scroll',(res) =>{letheight = res.targetthis.scrollTop= height.scrollTop},false) },beforeDestroy() {this.$refs.table.bodyWrapper.removeEventListener('scroll',(res) =>{letheight = res.targetthis.scrollTop= heigh...
有一个需求,当el-table的宽度超出浏览器宽度时,虽然el_table底部会出现滚动条,但是每次需要先滚动到底部,才能使用el-table的滚动体,很是麻烦。因此当el_table的宽度超出屏幕宽度时,要在可视范围底部添加一个横向的滚动条,在网上找了四篇不同方法,全都试了一遍,四个方法的原文地址以及效果图我都贴出来了,看个人...
1:首先给el-table添加 ref属性 及 row-click事件 2:row-click事件中记录下当前el-table的滚动条位置 //获取当前滚动条的位置 并赋值给 this.Nowscroll 记录下来 let vmEl = this. el const scrollParent = vmEl.querySelector('.el-table__body-wrapper') ...
element的el-table中记录滚动条位置的⽰例代码 场景重现：在项⽬中使⽤了keep-alive来缓存组件，且使⽤element中的table列表，但在项⽬中是对table进⾏了⼆次封装，跟页码合在了⼀起。按照⽹上的直接对scrollTop赋值，赋值失败了，还要加上setTimeout才能成功，虽然实现了功能，但是不知道原因，可以...
} .el-table.hide-scrollBar{ /*隐藏滚动条 设置底部padding20px*/ scrollbar-width: none; /* Firefox */ -ms-overflow-style: none; /* IE 10+ */ padding-bottom: 20px; } .el-table.hide-scrollBar ::-webkit-scrollbar { display: none; /* Chrome Safari */ } </style> <!--tableDemo...
el-table表格刷新滚动条位置 当tableData 表格数据动态更新时,滚动条位置还停留在上一次关闭时的位置 这是需要设置给它拉回到0 也可以用此来设置比如动态在末尾添加一条数据时让滚动条滚动到对应的行尾位置 1,先给表格加个 ref 2,拉回顶部 3,设置滚动至底部...
1.这里涉及到两个Dom元素,类名分别为el-table__body-wrapper、el-table__body通过观察发现横向滚动条在于el-table__body-wrapper上,el-table__body则是实际的列表内容,当el-table__body宽度超出el-table__body-wrapper时就会出现横向滚动条。 2.因此只需要动态的修改el-table__body-wrapper的height即可实现想要...