vue+element table 合并单元格(根据相同id)
getData() {
// 先给所有的数据都加一个v.rowspan = 1
this_.yulanList.forEach((item) => {
item.rowspan = 1;
});
// 双层循环
for (let i = 0; i < this_.yulanList.length; i++) {
// 内层循环,上面已经给所有的行都加了item.rowspan = 1
// 这里进行判断
// 如果当前行的CCOITEM_ID和下一行的CCOITEM_ID相等
// 就把当前item.rowspan + 1
// 下一行的item.rowspan - 1
for (let j = i + 1; j < this_.yulanList.length; j++) {
//此处可根据相同字段进行合并,此处是根据的id
if (this_.yulanList[i].CCOITEM_ID === this_.yulanList[j].CCOITEM_ID) {
this_.yulanList[i].rowspan++;
this_.yulanList[j].rowspan--;
}
}
// 这里跳过已经重复的数据
i = i + this_.yulanList[i].rowspan - 1;
}
},
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
//第一列
if (columnIndex === 0) {
return {
rowspan: row.rowspan,
colspan: 1,
};
}
},
<el-table :data="tableData" :span-method="objectSpanMethod" border style="width: 100%; margin-top: 20px"> </el-table>
官方文档:https://element.eleme.cn/#/zh-CN/component/table


span-method

浙公网安备 33010602011771号