vue.js - 如何总结表格中的行跨度（element-ui）

Question

我知道表格元素有汇总方法。我的问题是，是否有任何可能的方法来实现行跨摘要？

我的想法是重新扫描tabledata，并为rowspan记录插入新数据：例如对于相同的id，我需要插入一个新的摘要记录。因此，tabledata 应该有 3 个新的摘要记录

  tableData: [{
     id: '12987122',
     name: 'Tom',
     amount1: '234',
     amount2: '3.2',
     amount3: 10
   }, {
     id: '12987122',
     name: 'Tom',
     amount1: '165',
     amount2: '4.43',
     amount3: 12
   }, {
     id: '12987124',
     name: 'Tom',
     amount1: '324',
     amount2: '1.9',
     amount3: 9
   }, {
     id: '12987124',
     name: 'Tom',
     amount1: '621',
     amount2: '2.2',
     amount3: 17
   }, {
     id: '12987126',
     name: 'Tom',
     amount1: '539',
     amount2: '4.1',
     amount3: 15
   }],

重置 tableData 后

  tableData: [{
     id: '12987122',
     name: 'Tom',
     amount1: '234',
     amount2: '3.2',
     amount3: 10
   }, {
     id: '12987122',
     name: 'Tom',
     amount1: '165',
     amount2: '4.43',
     amount3: 12
   }, {
     id: '12987122',
     name: 'summary',
     amount1: 'xxx',
     amount2: 'xxx',
     amount3: xxx
   }, {
     id: '12987124',
     name: 'Tom',
     amount1: '324',
     amount2: '1.9',
     amount3: 9
   }, {
     id: '12987124',
     name: 'Tom',
     amount1: '621',
     amount2: '2.2',
     amount3: 17
   }, {
     id: '12987124',
     name: 'summary',
     amount1: 'xxx',
     amount2: 'xxx',
     amount3: xxx
   }, {
     id: '12987126',
     name: 'Tom',
     amount1: '539',
     amount2: '4.1',
     amount3: 15
   }, {
     id: '12987126',
     name: 'Summary',
     amount1: 'xxx',
     amount2: 'xxx',
     amount3: xxx
   }],

我认为这可能不是一个好的解决方案。任何想法？ 预期结果应该有 3 个新行用于汇总

标签： vue.jselement-ui