使用 span-method 方法,该方法接收4个参数: row, column, rowIndex, columnIndex, 返回单元格 一个对象{rowspan: 1,colspan: 1}
合并单元格
{rowspan: n,colspan: 1}, 被合并的单元格返回{rowspan: 0,colspan: 0},默认不被合并的单元格{rowspan: 1,colspan: 1}
let sortObj = {}
function objectSpanMethod({ row, column, rowIndex, columnIndex }) {
if (['mtg_id','date'].includes(column.rawColumnKey)) { // 要合并的表格列(字段)
let arr = []
if (rowIndex === 0) { // 只有第一行去生成数据
sortObj[column.rawColumnKey] = []
arr = getSpanArr(cloneDeep(tableData.value), column.rawColumnKey) //生成对应列,每一行的单元格对象
sortObj[column.rawColumnKey] = arr // 缓存一下
} else {
arr = sortObj[column.rawColumnKey] // 从缓存中获取对应的key 的单元格对象组成的数组
}
const row = arr[rowIndex].row
const col = arr[rowIndex].col
return {
rowspan: row,
colspan: col
}
} else {
return {
rowspan: 1,
colspan: 1
}
}
}
生成对应列的单元格对象数组
function getSpanArr(data, key) {
const newArr = []
for (let j = 0; j < data.length; j++) {
let item = data[j]
if (key === 'date') {
item.date = parseTime(item.date, 'YYYY-MM-DD')
}
if (j === 0) {
newArr.push({
row: 1,
col: 1
})
} else {
if (item[key] === data[j - 1][key]) {
newArr.push({
row: 0,
col: 0
})
let index = j - 1
while(newArr[index].row === 0) {
if (index >0 ) {
index--
}
}
newArr[index].row++
} else {
newArr.push({
row: 1,
col: 1
})
}
}
}
return newArr
}
合并后的效果