element-ui 表格合计行自定义

最新推荐文章于 2024-06-05 11:59:57 发布

「已注销」

最新推荐文章于 2024-06-05 11:59:57 发布

阅读量461

点赞数

分类专栏： vue组件部分设置文章标签： javascript servlet 前端

本文链接：https://blog.youkuaiyun.com/qq_55385453/article/details/127305165

版权

本文介绍了在前端开发中，使用Element-UI组件库遇到的表格合计行自定义需求的解决方案。通过绑定getSummaries方法，并对其返回值进行处理，实现了当前页面及全部数据的总计展示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

记录一下开发中遇上的表格合计行自定义的需求和解决方法。

问题：

需要做一个当前页面合计和全部数据的总计。

解决：

1、绑定一个方法（getSummaries）

2、最终需要的是该方法的返回值进行处理

   // 表格总计
      getSummaries(param) {
        const { columns, data } = param;
        const sums = [];
        var totalNum = [0,0,0,0,0];
        for (let i = 0; i < data.length; i++) {
          if(data[i].mealBlext3 == 1){totalNum[0]++;}
          if(data[i].lunch == 1){totalNum[1]++;}
          if(data[i].lunchNoodles == 1){totalNum[2]++;}
          if(data[i].dinner == 1){totalNum[3]++;}
          if(data[i].boxLunch == 1