vue+element table 合并单元格(根据相同id)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 | getData() { // 先给所有的数据都加一个v.rowspan = 1 this_.yulanList.forEach((item) => { item.rowspan = 1; }); // 双层循环 for ( let i = 0; i < this_.yulanList.length; i++) { // 内层循环,上面已经给所有的行都加了item.rowspan = 1 // 这里进行判断 // 如果当前行的CCOITEM_ID和下一行的CCOITEM_ID相等 // 就把当前item.rowspan + 1 // 下一行的item.rowspan - 1 for ( let j = i + 1; j < this_.yulanList.length; j++) { //此处可根据相同字段进行合并,此处是根据的id if (this_.yulanList[i].CCOITEM_ID === this_.yulanList[j].CCOITEM_ID) { this_.yulanList[i].rowspan++; this_.yulanList[j].rowspan--; } } // 这里跳过已经重复的数据 i = i + this_.yulanList[i].rowspan - 1; } }, objectSpanMethod({ row, column, rowIndex, columnIndex }) { //第一列 if (columnIndex === 0) { return { rowspan: row.rowspan, colspan: 1, }; } }, |
1 2 | < el-table :data="tableData" :span-method="objectSpanMethod" border style="width: 100%; margin-top: 20px"> </ el-table > |
官方文档:https://element.eleme.cn/#/zh-CN/component/table
span-method
· [翻译] 为什么 Tracebit 用 C# 开发
· 腾讯ima接入deepseek-r1,借用别人脑子用用成真了~
· Deepseek官网太卡,教你白嫖阿里云的Deepseek-R1满血版
· DeepSeek崛起:程序员“饭碗”被抢,还是职业进化新起点?
· RFID实践——.NET IoT程序读取高频RFID卡/标签