el-table合并行或列，el-table 怎么把表格相同的数据 合并为一行

1、el-table 怎么把表格相同的数据 合并为一行？
需求：表格中会有多个项目名称(name)，每个项目名称所对应的阶段数(stage)不固定，要将项目名称相同的合并为一个单元格；

<el-table
   :data="tableData"
   :span-method="objectSpanMethod"
   border
   style="width: 100%"
   v-loading="loading"
   element-loading-background="rgba(255, 255, 255)"
   :header-cell-style="{
     textAlign: 'center',
     'background-color': '#F5F7FA',
   }"
   :cell-style="{ textAlign: 'center' }"
 >
   <el-table-column prop="name" label="项目名称"> </el-table-column>
   <el-table-column prop="amount1" label="合约电量阶段"> </el-table-column>
   <el-table-column prop="amount3" label="区间电量范围"> </el-table-column>
   <el-table-column prop="amount2" label="实际发电量">
   </el-table-column>
 </el-table>

data: {
	return {
		tableData: [
        {
          id: '12987122',
          name: '嗷嗷',
          stage: '阶段1',
          amount2: '3.2',
          amount3: 10,
        },
        {
          id: '12987123',
          name: '嗷嗷',
          stage: '阶段2',
          amount2: '4.43',
          amount3: 12,
        },
        {
          id: '12987126',
          name: '人挺好',
          stage: '阶段1',
          amount2: '4.1',
          amount3: 15,
        },{
          id: '12987122',
          name: '人挺好',
          stage: '阶段2',
          amount2: '3.2',
          amount3: 10,
        },
        {
          id: '12987123',
          name: '人挺好',
          stage: '阶段3',
          amount2: '4.43',
          amount3: 12,
        },
        {
          id: '12987126',
          name: '呵呵',
          stage: '阶段1',
          amount2: '4.1',
          amount3: 15,
        },
      ],
	}
}

    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        // 获取当前单元格的值
        const currentValue = row[column.property];
        // 获取上一行相同列的值
        const preRow = this.tableData[rowIndex - 1];
        const preValue = preRow ? preRow[column.property] : null;
        // 如果当前值和上一行的值相同，则将当前单元格隐藏
        if (currentValue === preValue) {
          return { rowspan: 0, colspan: 0 };
        } else {
          // 否则计算当前单元格应该跨越多少行
          let rowspan = 1;
          for (let i = rowIndex + 1; i < this.tableData.length; i++) {
            const nextRow = this.tableData[i];
            const nextValue = nextRow[column.property];
            if (nextValue === currentValue) {
              rowspan++;
            } else {
              break;
            }
          }
          return { rowspan, colspan: 1 };
        }
      }
    }

实现效果：

2、el-table合并行或列

<el-table
  :data="tableData"
  :span-method="objectSpanMethod"
  border
  style="width: 100%; margin-top: 20px">
  <el-table-column
    prop="id"
    label="ID"
    width="180">
  </el-table-column>
  <el-table-column
    prop="name"
    label="姓名">
  </el-table-column>
  <el-table-column
    prop="amount1"
    label="数值 1（元）">
  </el-table-column>
  <el-table-column
    prop="amount2"
    label="数值 2（元）">
  </el-table-column>
  <el-table-column
    prop="amount3"
    label="数值 3（元）">
  </el-table-column>
</el-table>

tableData: [{
  id: '12987122',
  name: '王小虎',
  amount1: '234',
  amount2: '3.2',
  amount3: 10
}, {
  id: '12987123',
  name: '王小虎',
  amount1: '165',
  amount2: '4.43',
  amount3: 12
}, {
  id: '12987124',
  name: '王小虎',
  amount1: '324',
  amount2: '1.9',
  amount3: 9
}, {
  id: '12987125',
  name: '王小虎',
  amount1: '621',
  amount2: '2.2',
  amount3: 17
}, {
  id: '12987126',
  name: '王小虎',
  amount1: '539',
  amount2: '4.1',
  amount3: 15
}]

methods: {
 objectSpanMethod({ row, column, rowIndex, columnIndex }) {
   if(columnIndex===1) {
     if(rowIndex===1) {
       // 第2列，第2行（表头不算）
       // 第一个元素代表rowspan，第二个元素代表colspan
       return [2, 2];
     }else if(rowIndex===2) {
       // 第2列，第3行（表头不算）
       return [0, 0];
     }
   }
   else if(columnIndex===2) {
     if(rowIndex===1 ) {
       // 第3列，第2行（表头不算）
       return [0, 0];
     }else if(rowIndex===2) {
       // 第3列，第3行（表头不算）
       return [0, 0];
     }
   }
 } 
}