el-table 平铺数据合并单元格

<el-table :data="tableData" :max-height="tableHeight" :header-cell-style="getRowClass" @selection-change="handleSelectionChange" :span-method="objectSpanMethod" border fit highlight-current-row>
</el-table>

data中定义

mergeObj: {},
mergeArr: [] //需要合并的单元格

方法

this.tableData = data.list || []
this.getSpanArr(this.tableData) //数据处理
getSpanArr(data) {
      this.mergeArr.forEach((key, index1) => {
        let count = 0
        this.mergeObj[key] = []
        data.forEach((item, index) => {
          if (index === 0) {
            this.mergeObj[key].push(1)
          } else {
            if (item[key] === data[index - 1][key]) {
              this.mergeObj[key][count] += 1
              this.mergeObj[key].push(0)
            } else {
              count = index
              this.mergeObj[key].push(1)
            }
          }
        })
      })
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (this.mergeArr.indexOf(column.property) !== -1) {
        if (this.mergeObj[column.property][rowIndex]) {
          return [this.mergeObj[column.property][rowIndex], 1]
        } else {
          return [0, 0]
        }
      }
    }