elementui el-table在有summary-method时,table数据行将合计行遮挡住了
这个问题可能是由于Element UI的el-table
组件在计算合计行位置时出现了错误,导致合计行遮挡了数据行。
解决方法:
- 确保你使用的Element UI版本是最新的,因为在新版本中可能已经修复了这个问题。
- 如果更新Element UI版本后问题依旧,可以尝试以下CSS样式覆盖来解决:
.el-table .el-table__footer-wrapper tbody,
.el-table .el-table__header-wrapper tbody {
z-index: 2;
}
.el-table tbody {
z-index: 1;
}
通过增加z-index
的值,可以确保表格的数据行总是显示在合计行之上。
- 如果上述方法不奏效,可以尝试在
el-table
标签中添加show-summary
属性,并提供一个summary-method
,即使不需要显示任何自定义合计,这也可以确保表格正确计算行位置。
<el-table
:data="tableData"
show-summary
:summary-method="handleSummary"
>
<!-- 你的表格列定义 -->
</el-table>
methods: {
handleSummary(param) {
// 这里可以实现自定义合计逻辑,但如果不需要自定义合计,可以返回空数组或者对象
return [];
}
}
以上方法应该可以解决合计行遮挡数据行的问题。如果问题依然存在,可以查看官方文档或者在Element UI的GitHub仓库中提交issue寻求帮助。
评论已关闭