目前已生成示例，可一键启用试玩：
https://www.aliwork.com/bench/coe?tplUuid=TPL_UTK63IM281XRSXLNOJUV&from=yuque_subject
- 效果如下:
// 定义一个函数来计算每个字段的rowSpan值 by 页一 // data 为传入的数据源数据,格式为数组// keys 就是要合并的单元格字段,格式为数组functioncalculateRowSpan(data, keys) { letvalueList= []; keys.forEach((key, index) => { letn=0; for (leti=0; i<data.length; i++) { valueList[i] =valueList[i] &&`${valueList[i]}_${data[i][key]}`||data[i][key]; if (i===0||valueList[i] !==valueList[i-1]) { n=i; if (!data[i].rowSpan) data[i].rowSpan= {}; data[i].rowSpan[key] =1; } else { if (!data[i].rowSpan) data[i].rowSpan= {}; data[i].rowSpan[key] =0; data[n].rowSpan[key]++; } } }) }
// 数据会被处理成这个样子,多一个rowSpan对象属性{ "field_leoxpao1": "2024", "field_leoxpanx": "01", "field_leoxpanz": "页一", "field_lep1oqa9": "2023/03/07 08:00-09:00", "field_leoxpao5": "我是谁", "rowSpan": { "field_leoxpao1": 8, "field_leoxpanx": 8, "field_leoxpanz": 2 } }
// 使用方法 先处理数据,再给表格的cellProps事件配置回调// keys 为要合并单元格的字段// 特别注意,这些字段不是乱传的,必须按表格字段从左到右的顺序// 因为合并顺序是从左到右constkeys= ['field_leoxpao1', 'field_leoxpanx', 'field_leoxpanz']; // 处理数据,合并单元格使用// res.data 一般是数据源请求的数据// calculateRowSpan 这个函数会修改原数据,只增加一个属性,不影响其他数据// 等待calculateRowSpan处理完数据,你就可以setState()给表格的绑定的变量calculateRowSpan(res.data, keys); // 表格的单元格分割与合并 cellProps 事件// 事件所在位置: 表格=>风格和样式=>单元格分割合并exportfunctioncellProps(rowIndex, colIndex, dataIndex, record) { //如果不是mock数据,在设计模式这个属性是undefined直接退出,避免设计模式报错if (!record.rowSpan) return; if (keys.includes(dataIndex)) return { rowSpan: record.rowSpan[dataIndex] }; }
+
