完美解决el-table设置高度和合计showsummary冲突不显示问题

上次说得el-table设置高度后合计showsummary不显示解决方法在有分页的时候会有重叠问题,下面给一个更简单的方法!

1、在el-table中加上ref属性


<el-table
  :data="listData"
  v-loading="dataLoading"
  :summary-method="getSummaries"
  show-summary
  :height="tableHd"
  ref="tableData"
>

//show-summary 合计
//height 设置高度

2、在updated生命周期函数


this.$nextTick(() => {
  this.tableHd = document.body.clientHeight + "px";
  this.$refs.tableData.doLayout();
});

注意:一定要写到updated里面。不要写到mounted里面

以上是编程学习网小编为您介绍的“完美解决el-table设置高度和合计showsummary冲突不显示问题”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。

本文标题为:完美解决el-table设置高度和合计showsummary冲突不显示问题

基础教程推荐