element ui表格相同内容自动合并

一开始觉得合并单元格很困难，什么鬼，后来仔细查看api,发现是可以实现的，特此记录下，直接看代码，

项目需求是第一列和第二列还有第16列需要相同内容进行合并，所以判断条件是不同的；

实现后效果如下：

<el-table
:data="tableDataOne"
style="width: 100%"
:span-method="objectOneMethod">

</el-table>

methods:{

let spanOneArr = [],
spanTwoArr = [],
concatOne = 0,
concatTwo = 0;
tableData.forEach((item,index)=>{
if(index === 0){
spanOneArr.push(1);
spanTwoArr.push(1);
}else{
if(item.topic === tableData[index - 1].topic){ //第一列需合并相同内容的判断条件
spanOneArr[concatOne] += 1;
spanOneArr.push(0);
}else{
spanOneArr.push(1);
concatOne = index;
};
if(item.name === tableData[index - 1].name){//第二列和第16列需合并相同内容的判断条件

spanTwoArr[concatTwo] += 1;
spanTwoArr.push(0);
}else{
spanTwoArr.push(1);
concatTwo = index;
};
}
});
return {
one: spanOneArr,
two: spanTwoArr
}
},

objectOneMethod({ row, column, rowIndex, columnIndex }) {
if(columnIndex === 0 ) {
const _row = (this.setTable(this.tableDataOne).one)[rowIndex];
const _col = _row > 0 ? 1 : 0;
return {
rowspan: _row,
colspan: _col
};
}
if(columnIndex === 1 || columnIndex === 15) {
const _row = (this.setTable(this.tableDataOne).two)[rowIndex];
const _col = _row > 0 ? 1 : 0;
return {
rowspan: _row,
colspan: _col
};
}
},

}；
希望能帮到有需要的童鞋们；