检查el-table的CSS样式,确认是否有覆盖或影响滚动条显示的设置: 检查是否有全局CSS样式或特定样式覆盖了el-table的滚动条设置。你可以通过浏览器的开发者工具(F12)来查看el-table及其父元素的CSS样式,确保没有overflow: hidden等可能隐藏滚动条的样式。 确认浏览器是否支持并正确显示了滚动条: 尝试在其他元素上设置固...
只需要设置样式,自己考虑需不需要加穿透 /deep/ .el-table { display: flex; flex-direction: column; .el-table__header-wrapper { flex-shrink: 0; } .el-table__body-wrapper { flex-grow: 1; } }
为了解决该问题，尝试将单位改为视窗高度（vh），以达到不同大小屏幕的高度调整。这确实解决了高度匹配问题，但在使用max-height后，组件却无法实现滚动。此时，通过调整CSS中的滚动属性，使得组件能够在设置max-height后正常滚动。然而，滚动实现后，却发现表头UI错乱，检查后发现是溢出隐藏导致。解决方法是...
用el-table 想让表格高度根据屏幕动态展示,用max-height后发现内容超过高度不展示滚动条 查阅后发现默认是隐藏,而不是滚动展示 如果想让展示,则可以用样式加上overflow-y: auto 全部代码如下 <template><el-tablesize="small":data="tableData":max-height="tableHeight"style="width: 100%; overflow-y: auto"...
利用继承改vue组件 解决el-table中max-height为比例值的滚动问题 #程序员 - 程序员小山与Bug于20220404发布在抖音,已经收获了142.0万个喜欢,来抖音,记录美好生活!
/* 高度不设置的话滚动条出不来 */ height: 1px; } 1. 2. 3. 4. 5. 6. 7. 8. 2、给滚动条设置初始值 data(){ return{ topScrollWidth: 0, tableDom: null, } }, methods:{ setScrollWidth() { //设置顶部滚顶条宽度值为表格的滚动宽度 ...
因为表格条数太多,想设置固定高度解决。设置max-height相对友好很多。但是发现element UI el-table 在计算table高度的时候有问题,在高度没有500px的情况下有时候会出现滚动列 环境 Element UI :2.13.0 问题页面 在操作后面多了一列,其实这里是滚动条预留的列,只是这里表格高度完全不需要滚动。看了下css渲染,表格的...
el-table表格设置滚动条 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。如果表格只有一条数据...
1. 在 Vue 单文件组件中引入 el-table 组件,并设置表格的数据源和列配置。 2. 通过设置 el-table 的 maxHeight 属性,限制表格的最大高度,例如设置为 400px。 3. 设置 el-table 的 overflow 属性为 'auto',当表格内容超过容器高度时,会自动显示滚动条。 4. 在实际应用中,可以根据需求调整 maxHeight 和 ...