element自带的属性 :span-method可以实现合并具有相同值的指定列
<el-table
:data="tableData"
border
style="width: 100%"
:span-method="objectSpanMethod"
>
方法
this.getSpanNumArr(this.tableData);//tableData指表格数据,若数据是后端请求,则写在请求完数据后
getSpanNumArr(data) {
this.spanNumArr = [];
this.posNum = 0;
for (var i = 0; i < data.length; i++) {
if (i === 0) {
this.spanNumArr.push(1);
this.posNum = 0;
} else {
if (data[i].func === data[i - 1].func) {
this.spanNumArr[this.posNum] += 1;
this.spanNumArr.push(0);
} else {
this.spanNumArr.push(1);
this.posNum = i;
}
}
}
},
// 设置合并行
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
if (column.property == "func") {
const _row = this.spanNumArr[rowIndex];
const _col = _row > 0 ? 1 : 0; // 0 值是为了去除错位
return {
rowspan: _row,
colspan: _col,
};
}
},
以上的func是想合并的列