1. 确定el-table中滚动条的目标位置 首先,你需要确定滚动条需要滚动到的目标位置。这通常是通过表格中的行或单元格的索引来确定的。例如,你可能想滚动到第10行或包含特定数据的单元格。 2. 使用Vue.js或Element UI的API来操作el-table的滚动条 Element UI的el-table组件并没有直接提供滚动到指定位置的API,但我...
在 Element UI 中,el-table组件内部确实有一个滚动条,但是直接获取滚动条的位置(scrollLeft或scrollTop)可能并不直接支持。 通常,要获取一个 DOM 元素的滚动位置,你可以直接访问该元素的scrollLeft和scrollTop属性。但是,由于el-table组件的滚动行为可能被封装或处理,直接访问可能无法获取到期望的值。 如果你已经获取到...
const rowElement = document.getElementById(`table_${row.id}`); if (rowElement) { const { top } = rowElement.getBoundingClientRect(); const { top: tableTop } = tableBodyWrapper.getBoundingClientRect(); tableBodyWrapper.scrollTop += top - tableTop; // 滚动到展开行的位置 } } }); }...
1,先给表格加个 ref 2,拉回顶部 3,设置滚动至底部 this.$refs.dialogTable1.bodyWrapper.scrollTop =this.$refs.dialogTable1.bodyWrapper.scrollHeight; 也可以写在组件中, 在组件更新后重新渲染其滚动条位置
这是因为 `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中记录滚动条位置的示例代码 element的el-table中记录滚动条位置的⽰例代码 场景重现：在项⽬中使⽤了keep-alive来缓存组件，且使⽤element中的table列表，但在项⽬中是对table进⾏了⼆次封装，跟页码合在了⼀起。按照⽹上的直接对scrollTop赋值，赋值失败了，还要加上setTimeout...
}// 设置滚动条位置tableElement.bodyWrapper.scrollTop= totalHeight;// 在循环之外执行以下操作(标红选中的行)// for (let i = 0; i < theTableRows.length; i++) {// if (i === rowIndex) {// const rowEl = theTableRows[i];// // 触发该行鼠标移入效果// const hoverEvent = new Mou...
场景:表格列数太多,为表格添加固定列,将序号和名称列固定在表格左侧,操作列固定在表格右侧,出现横向滚动条,可以通过拖动滚动条查看非固定列。 问题:横向滚动条在固定列下方的位置无法拖动。只有在非固定列的下方位置才可以拖动 问题原因:固定列将下方的滚动条盖住了,无法触发滚动条的滚动。