一、處理列表數(shù)組冻押,統(tǒng)計(jì)需要合并的列驰贷,如這里需要合并的是tableData里面的date。其實(shí)就是計(jì)算哪個(gè)合并的值洛巢,需要合并多少行括袒。
// 建立相同行關(guān)系
\// 按key為合并行名,value為合并行數(shù)存儲(chǔ)
// 計(jì)算相同行key值和行數(shù)
this.tableData.map(item => {
if (item.date in this.colSpan) { // 判斷當(dāng)前已有值在相同行關(guān)系列表中稿茉,有則遞增锹锰,沒(méi)有則賦值為1
this.colSpan[item.date]++
} else {
this.$set(this.colSpan,item.date,1)
}
})
二、element-ui table組件里的span-method屬性添加以下邏輯
spanMethod({ row, column, rowIndex, columnIndex }) {
// 第一列時(shí)
if (columnIndex === 0) {
if (row.date in this.colSpan) {
const obj = {
// 設(shè)置合并值
rowspan: this.colSpan[row.date],
colspan: 1
}
delete this.colSpan[row.date]
return obj
} else {
// 其余被合并子項(xiàng)隱藏
return {
rowspan: 0,
colspan: 0
}
}
}
}