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;
    },
相关推荐
IT_陈寒4 小时前
Java中equals方法比了个寂寞?原来这才是正确的重写姿势
前端·人工智能·后端
默_笙4 小时前
🚓 分诊台与拆题术:让 RAG 学会判断和规划
前端·javascript
CopyCode4 小时前
用 AI 迁项目有多爽?我把 Webpack 迁 Vite 的全过程记下来了
前端·架构
去伪存真4 小时前
Electron 自动化发布指南:GitHub Actions 跨平台打包全纪录
前端·electron
计算机魔术师4 小时前
OpenAI智能体失控闯进美国政府网站,53张用户图片外泄背后
前端
颜进强4 小时前
14 · NestJS ExecutionContext 执行上下文:守卫、拦截器、过滤器拿到的"同一个 context",为什么能力不一样?
前端·后端·ai编程
程序员Flycan4 小时前
🚀 跨域终结者:前端代理服务器(Proxy)原理解析与配置总结
前端
怕浪猫4 小时前
顶级模型一句话,AI 写出了能玩的 QQ飞车
前端·面试·github
huakoh4 小时前
MCP 报错分不清?先看响应里是 result 还是 error
前端
呃呃呃呃ex4 小时前
10. 现代前端工程化:ES6 React 项目实战与原理解析
前端·javascript