【ElementUI】el-table值相同时合并行

效果图：

大致思路：el-table里添加合并行或列的计算方法span-method

<el-table :data="tableList" :span-method="objectSpanMethod">

     // 在获取到列表数据tableData后调用此方法   
     handleTableData(tableData) {
        let rowSpanArr = [], position = 0;
        for (let [index, item] of tableData.entries()) {
          if (index === 0) {
            rowSpanArr.push(1);
            position = 0;
          } else {
            // 此处判断userName相同时进行合并，需要替换自己的属性名
            if (item.userName === tableData[index - 1].userName) {
              rowSpanArr[position] += 1; //名称相同，合并到同一个数组中
              rowSpanArr.push(0);
            } else {
              rowSpanArr.push(1);
              position = index;
            }
          }
        }
        this.rowSpanArr = rowSpanArr;
      },
      // 合并行或列的计算方法
      objectSpanMethod({ row, column, rowIndex, columnIndex }) {
        // userName属性对应列表第0列
        if (columnIndex === 0 ) {
          if (this.rowSpanArr.length > rowIndex) {
            const rowSpan = this.rowSpanArr[rowIndex];
            return {
              rowspan: rowSpan, //行
              colspan: 1 //列
            };
          }
        }
      },