记录element ui合并单元格（非原创）

记一次 elementui 合并单元格

1. 在获取数据时先将数据需要合并列标记出。
2. 调用element ui的合并单元格方法。

在这里插入代码片
methods:{
 getList() {
        getlist().then(res => {
          this.tableData = res.data.data
          this.rowMergeData = this.rowMergeHandle(['lieA', 'lieB', 'lieC'], this.tableData) 
          //lieA 分别对应为table绑定的prop属性，rowMergeData 暂存需要处理的列项
        }).catch(err => {

        })
      },
       arraySpanMethod({ row, column, rowIndex, columnIndex }) {
        // // 合并对应字段的数据，仅对相邻起作用
        if (column.property === 'lieA') return this.mergeAction('lieA', rowIndex, column)
        if (column.property === 'lieB') return this.mergeAction('lieB', rowIndex, column)
        if (column.property === 'lieC') return this.mergeAction('lieC', rowIndex, column)
      },
      //处理前后数据不一致则需要合并
      rowMergeHandle(arr, data) {
        if (!Array.isArray(arr) && !arr.length) return false
        if (!Array.isArray(data) && !data.length) return false
        let needMerge = {}
        arr.forEach(i => {
          needMerge[i] = {
            rowArr: [],
            rowMergeNum: 0
          }
          data.forEach((item, index) => {
            if (index === 0) {
              needMerge[i].rowArr.push(1)
              needMerge[i].rowMergeNum = 0
            } else {
              if (item[i] === data[index - 1][i]) {
                needMerge[i].rowArr[needMerge[i].rowMergeNum] += 1
                needMerge[i].rowArr.push(0)
              } else {
                needMerge[i].rowArr.push(1)
                needMerge[i].rowMergeNum = index
              }
            }
          })
        })
        return needMerge
      },
       mergeAction(val, rowIndex, colData) {
        let _row = this.rowMergeData[val].rowArr[rowIndex]
        let _col = _row > 0 ? 1 : 0
        return [_row, _col]
      },
}