1. 确定el-table内容需要滚动的方式 首先,你需要确定你的表格内容是需要水平滚动、垂直滚动,还是两者都需要。 2. 在el-table标签中添加相应的滚动属性 水平滚动:当表格列宽超出容器宽度时,可以通过设置 max-width 或width 属性在列上,并在 el-table 上添加 scroll-x="true" 来实现水平滚动。 垂直滚动:当表格行...
// 设置滚动位置 if(this.scrollLeft) { letid ='#perTable_'+this.randomNum const el = document.querySelector(id) setTimeout(() => { try{ $(el).find('.el-table__header-wrapper')[0].scrollLeft = scroll[0] $(el).find('.el-table__body-wrapper')[0].scrollLeft = scroll[1] }cat...
el-table超出一定高度设置滚动条两种方法,设置height和max-height都可出现滚动条。 1、给table设置height属性为250,表格固定有300px这么高。 <el-table:data="tableData"height="250"border style="width: 100%"> 2、给他变了设置max-height为300,表格数据超出250。如果表格只有一条数据,且高度没有超过300.表格...
方法1、在el-table上手动添加滚动条 1、在el-table上方添加一个div,div的宽度和表格的宽度相同。 <div ref="topScroll" class="top-scroll"> <div class="top-scroll-content" :style="{ width: topScrollWidth }"></div> </div> <el-table ref="tableRef" :data="list" v-loading.body="listLoad...
只需要设置样式,自己考虑需不需要加穿透 /注:此设置设置fixed列会出现无法响应滚动问题,解决此问题需设置具体高度 比如可以动态获取父元素高度给它/deep/.el-table{display:flex;flex-direction:column;.el-table__header-wrapper{flex-shrink:0;}.el-table__body-wrapper{flex-grow:1;}}...
[element-ui] el-table组件滚动条的宽度设置 1. 2. 3. 4. 5. 6. 参考: elementUI——el-table组件滚动条的宽度设置——css基础
解决方法:改变固定列的样式,给固定列设置下边距,下边距的大小等于横向滚定条的高度 注意:这样改样式如果屏幕分辨率足够大无横向滚动条时,固定列下方就会多出一道横线,不美观,可以用样式去除 样式代码如下: //给固定列设置下边距.el-table{.el-table__fixed{height:auto!important;bottom:8px!important;//具体值是...
当我们使用element table,有时我们需要部分的列固定,我们就给列添加了 fxied属性,但是这时候你会发现table的横向滚动条很难拖动,查找原因你会发现原来是固定的列把滚动条给挡住了,只有超出固定的部分滚动条才可以拖动。 解决办法 法一: 做法:修改el-table__fixed样式。
在开发过程中，el-table组件作为UI中的常客，其高度设置问题常让开发者头疼。Element框架贴心地提供了height和max-height两个属性来解决高度调整，但使用时会遇到一些陷阱。遇到的第一个问题是max-height的无效应用。在尝试设置max-height属性后，发现组件无法达到预期效果。通过代码检查，发现问题可能出在外部...
一、前言说明 网上一搜索,千篇一律的设置el-table__fixed,如: .el-table__fixed { // 左固定列 height: auto !important; bottom: 18px; } .el-table__fixed-right { // 右固定列 height: au