element-ui 表格底部留白/el-table__body-wrapper is-scrolling-none 高度错误

element-ui 表格底部留白/el-table__body-wrapper is-scrolling-none 高度错误

• • 问题描述
  • 解决方法
  • • 方法一
    • • ① 样式修改法一
      • ②样式修改法二
    • 方法二（暴力版）

问题描述

el-table__body-wrapper is-scrolling-none 的高度在没有完全展开的时候会造成表格体溢出，表格显示不完全，底部留白。

解决方法

方法一

这是网上搜罗到的方法，但对我没用，还是放出来给大家做个参考
动态计算table的高度。

① 样式修改法一

.assets-table  /deep/.el-table__body-wrapper {height: calc(100% - 40px) !important;}

assets-table 就是el-table 上面的class属性样式。

②样式修改法二

比上一种方法多了一个overflow

<style scoped>
.tableFormR /deep/ .el-table__body-wrapper {overflow-y: auto;height: calc(100% - 44px) !important;
}
</style>

tableFormR 就是el-table 上面的class属性样式。

方法二（暴力版）

在表格外嵌套一个div并设置div的高度即可 这个就比较白痴 但有效

 <div style="height: 267px"><el-table:data="sortDebit"style="width: 100%;"borderstripemax-height="267"class="common">...</el-table></div>

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！