el-table中根据某些字段信息合并单元格

 在使用element的table的时候，有些数据需求合并，但是官方提供的只有向下合并的方法，达不到我们预期的效果，或者没办法根据我们的需求和列数进行合并，就需要针对合并方法去指定符合我们需求的合并方法

let { data: res } = await this.$axios.get(`xxxxxxxxxxx`, { params });  //xxxxxxxxx为你的接口
      this.tableData = res.list
      for (let i = 0; i < this.tableData.length; i++) {
        // 如果是第一个数据，就将列表mergeList添加一个1，表示暂时只有一个名字相同的、且将索引mergeNum赋值为0
        if (i === 0) {
          this.mergeList.push(1);
          this.mergeNum = 0
        } else {
          // 判断当前元素与上一个元素是否相同
          if (this.tableData[i].payId === this.tableData[i - 1].payId) {
            // 如果相同就将索引为 mergeNum 的值加一
            this.mergeList[this.mergeNum] += 1;
            // 且将数组添加 0 
            this.mergeList.push(0);
          } else {
            // 如果元素不同了，就可以通过索引为 mergeNum 的值知晓应该需要合并的行数
            // 同时，我们再次添加一个值1，表示重新开始判断重复姓名的次数
            this.mergeList.push(1);
            // 同时 索引加一
            this.mergeNum = i;
          }
        }
      }

 关键代码

 判断是否与上个元素的根据合并的标识符相同，等循环结束就得到一个需要向下合并数量的数组this.mergeList以及需要向下进行合并的索引值this.mergeNum

然后根据官方给出的方法

objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 3 || columnIndex === 4) {
        const _row = this.mergeList[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          rowspan: _row,
          colspan: _col
        }
      }
    },

 这样table就会根据payId（示例）相同的进行合并列