效果：
我这用的虽然是vue-easytable，但是element UI的table这个方法是同样适用的，element合并单元格方法中有columnIndex，用
columnIndex判断是哪一列需要合并单元格，跟我的row.feild是一样的。
附上代码：
/ /传入需要处理的表格数据和列的key值 返回数组 每一行需要合并的单元格数
// 例：[2,0] 合并第一行和第二行 [3,0,0,2,0] 合并一到三 四到五行
flitterTableData (data, key) {
let arr = []
let concat = 0
data.forEach((item, index) => { // 循环表格数据
if (index === 0) {
arr.push(1)
} else {
if (item[key] === data[index - 1][key]) { // 每一列需合并相同内容的字段
arr[concat] += 1
arr.push(0)
} else {
arr.push(1)
concat = index
}
}
})
return {
arr
}
},
// 合并单元格
bodyCellSpan ({ row, column, rowIndex }) {
if (column.field === 'material_code') {
// 得到material_code列中每一行需要合并的单元格数
const _row = (this.flitterTableData(this.materialTableData, 'material_code')).arr[rowIndex]
const _col = _row > 0 ? 1 : 0
return {
rowspan: _row,
colspan: _col
}
}
if (column.field === 'material_name') {
// 得到material_name列中每一行需要合并的单元格数
const _row = (this.flitterTableData(this.materialTableData, 'material_name')).arr[rowIndex]
const _col = _row > 0 ? 1 : 0
return {
rowspan: _row,
colspan: _col
}
}
}
