解决Element-ui el-table合计 show-summary不显示,样式混乱问题

807 阅读1分钟

有时候需要在table的底部有合计,这时候官方给的是在table里设置,show-summary就可以了,但是给table加了一个固定高度的话,就不显示了,打开控制台可以看到这个合计是存在的,那么需要做三步,合计即可出现

1. el-table中加上ref属性

<el-table :data="tableData" @selection-change="selectItem" v-loading="loading" class="table-center" :summary-method="getSum" ref="tableData" show-summary height="600">

2.在updated生命周期函数

updated() {
  this.$nextTick(()=>{
    this.$refs.tableData.doLayout();
  })
},

3.修改el-table的样式

.el-table {   overflow: visible !important; }