// 处理合并行的数据 let pos: any const getSpanArr = (data: any, spanKey: any) => { var spanArr = []; for (var i = 0; i < data.length; i++) { if (i === 0) { spanArr.push(1); pos = 0; } else { // 判断当前元素与上一个元素是否相同 if (data[i][spanKey] === data[i - 1][spanKey]) { spanArr[pos] += 1; spanArr.push(0); } else { spanArr.push(1); pos = i; } } } return spanArr; }
const objectSpanMethod = ({
row,
column,
rowIndex,
columnIndex,
}: SpanMethodProps) => {
// 处理合并列的方法
//这里时只有前五列使用合并方法,如果全表格使用,可以删除这个判断
// data 就是从这里动态传过来的
// 如果数据中有id,可以传id进行合并,更加准确
//var spanArr = this.getSpanArr(data, "id");
var spanArr = getSpanArr(tableData, column.property);
const _row = spanArr[rowIndex];
const _col = _row > 0 ? 1 : 0;
return {
rowspan: _row,
colspan: _col,
};
}
const tableData = [ { color: '红色', size: '大', amount: '10', }, { color: '红色', size: '大', amount: '20', }, { color: '红色', size: '大', amount: '30', }, { color: '红色', size: '小', amount: '40', }, { color: '红色', size: '小', amount: '50', }, { color: '红色', size: '小', amount: '60', }, { color: '蓝色', size: '大号', amount: '70', }, { color: '蓝色', size: '大号', amount: '80', }, { color: '蓝色', size: '大号', amount: '90', }, { color: '蓝色', size: '小号', amount: '100', }, { color: '蓝色', size: '小号', amount: '110', }, { color: '蓝色', size: '小号', amount: '120', } ]