在我们处理表格的时候，经常会出现表格的样式进行 表格的合并，如下图：

 那么在el-table中如何进行合并了 ，上代码：

   //设置单元格
    getSpanArr(list) {
      // 先给所有的数据都加一个v.rowspan = 1
      list.forEach(item => {
        item.rowspan = 1;
      });
      // 双层循环
      for (let i = 0; i < list.length; i++) {
        for (let j = i + 1; j < list.length; j++) {
          //此处可根据相同字段进行合并，此处是根据的id
          if (list[i].stageIndex === list[j].stageIndex) {
            list[i].rowspan++;
            list[j].rowspan--;
          }
        }
        // 这里跳过已经重复的数据
        i = i + list[i].rowspan - 1;
      }
      this.tableData = list;
	  this.getSpanArr1(list);
    },

上面代码中的 if (list[i].stageIndex === list[j].stageIndex) 中的stageIndex就是你想合并的主键，可以是你的数据中的id或者等等都可，然后配置在el-table中加入:span-method="objectSpanMethod"

<el-table
				:data="tableData"
				:span-method="objectSpanMethod"
				style="text-align: left;margin-top:13px;">

下面就是对应的objectSpanMethod函数：

  //合并单元格
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      //第一列
      if (columnIndex === 0) {
        return {
          rowspan: row.rowspan,
          colspan: 1
        };
      }
      //第二列
      if (columnIndex === 1) {
        return {
          rowspan: row.rowspan,
          colspan: 1
        };
      }
	  if (columnIndex === 2) {
	    return {
	      rowspan: row.rowspan1,
	      colspan: 1
	    };
	  }
	  if (columnIndex === 6) {
	    return {
	      rowspan: row.rowspan1,
	      colspan: 1
	    };
	  }
	  if (columnIndex === 8) {
	    return {
	      rowspan: row.rowspan,
	      colspan: 1
	    };
	  }
    }

其中的 if (columnIndex === 8) 就是你想要合并的第几列，从0开始，大家注意到

if (columnIndex === 6) {
        return {
          rowspan: row.rowspan1,
          colspan: 1
        };
      }其中的  rowspan: row.rowspan1,其实就是此处用的另一个主键；如下：

	getSpanArr1(list) {
	  // 先给所有的数据都加一个v.rowspan = 1
	  list.forEach(item => {
	    item.rowspan1 = 1;
	  });
	  // 双层循环
	  for (let i = 0; i < list.length; i++) {
	    for (let j = i + 1; j < list.length; j++) {
	      //此处可根据相同字段进行合并，此处是根据的id
	      if(list[i].sum === list[j].sum ||list[i].poweraver === list[j].poweraver) {
	        list[i].rowspan1++;
	        list[j].rowspan1--;
	      }
	    }
	    // 这里跳过已经重复的数据
	    i = i + list[i].rowspan1 - 1;
	  }
	  this.tableData = list;
	},

 if(list[i].sum === list[j].sum ||list[i].poweraver === list[j].poweraver)用的另外的主键进行合并，这样就可以是多层级的，将结果存在rowspan1；上面是rowspan，此处就是参数不同就可，以上就是 关于el-table的多层级的合并，本文到此结束，顿首，有什么问题可以私信我，，，，，