el-table 添加合计,合计某一列

效果图:

el-table 添加合计,合计某一列_第1张图片

 1.   使用elementui 官网上的方法

如果是只要是数值,就要合并,就只设置show-summary 即可。

  

 2.  html:


    


      
      
      
      
      
      
      
    

3. js :

// 合计 指定某一列添加合计

    getSummaries(param) {
      console.log(param, "heji11111");
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        } else if (column.property == "Amount") {
          //如果是经费(正常的加减法)
          const values = data.map((item) => Number(item[column.property]));
          console.log(values);
          if (!values.every((value) => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr);
              var sum = 0;
              if (!isNaN(value)) {
                sum = Number(Number(prev) + Number(curr)).toFixed(2);
                return sum;
              } else {
                return prev;
              }
            }, 0);
            sums[index] += " ";
          }
        }
      });
      return sums;
    },
参考: el-table合计行合并自定义列数,单独合计某一列_刘远航,的博客-CSDN博客

你可能感兴趣的:(elementui,vue.js,elementui,javascript)