el-table合并行合并列
1.合并多行
objectSpanMethod ({ row, column, rowIndex, columnIndex }, list) {
// console.log("objectSpanMethod", columnIndex, list)
if (columnIndex === 4 || columnIndex === 5 || columnIndex === 6) {
if (rowIndex == 0) {
return {
rowspan: list.length,
colspan: 1
};
} else {
return {
rowspan: 0,
colspan: 0
};
}
}
},
//动态合并行
objectSpanMethod ({ row, column, rowIndex, columnIndex }) {
// columnIndex === xx 找到第xx列,实现合并随机出现的行数
if (columnIndex === 4) {
const _row = this.spanArr[rowIndex];
const _col = _row > 0 ? 1 : 0;
return {
rowspan: _row,
colspan: _col
};
}
},
// 因为要合并的行数是不固定的,此函数是实现合并随意行数的功能
getSpanArr () {
this.spanArr=[]
let pos = 0
for (var i = 0; i < this.dataTable.length; i++) {
if (i === 0) {
// 如果是第一条记录(即索引是0的时候),向数组中加入1
this.spanArr.push(1);
pos = 0;
} else {
if (this.dataTable[i].name=== this.dataTable[i - 1].name) {
this.spanArr[pos] += 1;
this.spanArr.push(0);
} else {
// 不相等push 1
this.spanArr.push(1);
pos = i;
}
}
}
},
2.合并多列
objectSpanMethod ({ row, column, rowIndex, columnIndex }) {
if (row.pushType == 2) {
if (columnIndex == 3) {
return [1, 4]
} else if (columnIndex == 4 || columnIndex == 5 || columnIndex == 6) {
return [0, 0]
}
}
},

浙公网安备 33010602011771号