el-table树状表格末行合计

首先,由于我的表头是动态的,所以就稍微复杂一点

效果图

表头数据格式是这样的

表格的数据格式是这样的

然后用合并的方法,此处就需要递归去计算,根据props去匹配每一列的数据,然后加起来,关键代码

复制代码
    //合计处理
    getSummaries(param) {
      const { columns, data } = param;
      const sums = ["合计"];

      let num = 0;
      const func = (arr, props) => {
        arr.forEach((item) => {
          if (item.map) {
            const value = item.map[props];
            // 转数字
            num += value && value != "" ? Number(value) : 0;
          }
          if (item.children && item.children.length > 0) {
            func(item.children, props);
          }
        });
      };

      columns.forEach((item, index) => {
        if (index > 0) {
          const props = item.property;
          num = 0;
          func(data, props);
          sums.push(num);
        }
      });

      return sums;
    },
相关推荐
Lorin 洛林12 小时前
一文读懂 Agent Skills
前端·网络
newbe3652413 小时前
我们如何使用 impeccable 优化前端界面设计与实现稳定性
前端·人工智能·分布式·github·aigc·wpf
KaMeidebaby20 小时前
卡梅德生物技术快报|蛋白 N 端测序在重组贻贝融合蛋白表征中的应用,解决原核表达序列偏移工艺难题
前端·人工智能·物联网·算法·百度
kyriewen21 小时前
我筛了 1400 个 Claude Code Skills,留下 5 个天天在用的
前端·ai编程·claude
JNX_SEMI21 小时前
AT2401C 2.4GHz 全集成射频前端单芯片技术解析
前端·单片机·嵌入式硬件·物联网·硬件工程
anOnion1 天前
Agentic 前端开发之 实时显示 AI Agent 终端输出
前端·javascript·人工智能
随风一样自由1 天前
【前端领域】2026最新前端领域全梳理(框架/工具/AI/跨端/底层标准/就业趋势)
前端·人工智能·前端框架
这是个栗子1 天前
【前端性能优化】优化数据加载:用 Promise.all 从串行到并行
前端·javascript·性能优化·异步编程·前端优化·promise.all
fei_sun1 天前
黑洞路由(Null Route/空接口路由)
服务器·前端·javascript
大爱一家盟1 天前
告别卡点BGM同质化 2026原创卡点音乐素材下载网站 TOP5 推荐
大数据·前端·人工智能