el-table合计行不展示，el-table自定义合计

el-table合并行不展示，可能是因为表格的高度超过了屏幕的高度，设置样式

.el-table {   
  overflow: visible !important; 
}
.el-table__footer-wrapper {
  overflow: auto;
}
.el-table--scrollable-x .el-table__body-wrapper {
  overflow: hidden;
}

el-table自定义合计行的样式，实例如下：

设置el-table,show-summary设置合计行，默认情况下，只要数据是数字类型的就会自动进行累加并且展示最后结果。:summary-method="getSummaries自定义合计行展示数据，可以设置不需要展示的累加数据。

    <el-table 
      :data="tableData" 
      style="width: 100%;margin-top:10px" 
      row-key="id"
      v-loading="tableLoading" 
      border size="small" 
      id="exportExcel" 
      show-summary
      :summary-method="getSummaries"
      >
<!-- ... 设置的各列数据 -->
</el-table>

// 表格合计 指定列
    getSummaries(param) {
      const Index = [6,8,11,12,13,14]
      const { columns, data } = param;
        const sums = [];
        columns.forEach((column, index) => {
          if (index === 0) {
            // 默认 第一列展示总计，可以进行修改
            sums[index] = '总价';
            return;
          }
            // 判断是否是数字 不是数字的话 展示空 是数字的话 添加'元'字
          const values = data.map(item => { 
            return Number(item[column.property]);
            });
          if (!values.every(value => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr);
              if (!isNaN(value)) {
                return prev + curr;
              } else {
                return prev;
              }
            }, 0);
            sums[index] += ' 元';
          } else {
            sums[index] = '';
          }
          if (Index.includes(index)) {
            sums[index] = ''
          }
        });
        return sums;
    },

需要对表格合计行进行合并的话，可以使用监听的方法，对表格进行监听：

watch: {
    tableData:{
        immediate:true,
        async handler(){
          await this.$nextTick(); // 数据假如是从异步获取的话，可以进行这部操作
          const tables = document.querySelectorAll('#exportExcel .el-table__footer-wrapper tr>td'); // 拿到合计行
          tables[0].colSpan=3; // 合并前三列
          tables[0].style.textAlign='center' // 居中显示
          tables[1].style.display='none' // 1/2设置为none后面的才不会移位，不然后面的会移位
          tables[2].style.display='none'
       }
    }
  },