demo效果
如上图实现表格中性别这一列实现行合并
实现要点
计算合并表格所需数据
该方法的主要目的是在表格渲染前,为表格合并行准备合并所需的数据,示例中是通过表格中的性别来判断是否需要合并
// 为表格行合并准备数据
getRowList() {
this.rowList = []
this.rowListpos = 0
this.tableData.forEach((item, index, arr) => {
// 表格第一行必须保留
if (index === 0) {
this.rowList.push(1)
this.rowListpos = 0
} else {
// 判断当前行性别与上一行性别是否相同 如果相同则合并
if (item.sex === arr[index - 1].sex) {
this.rowList[this.rowListpos] += 1
this.rowList.push(0)
} else {
this.rowList.push(1)
this.rowListpos = index
}
}
})
}
2024/1/15...大约 2 分钟