el-table-column 设置值显示 千分位

编写函数

formatNumber

    formatNumber(num){
      if (num != null)
        return num.toLocaleString('en-US');
    },

显示千分位并保留两位小数

    formatNumber(val) {
      if (val != null) {
        val = val.toLocaleString();//先显示千分位
        if (val.indexOf(".") == -1) {//没有小数点就加小数点并补两个零
          val = val + ".00";
        } else if (val.indexOf(".") == val.length - 2) {//小数点下标=长度减2,一位小数补一个零
          val = val + "0";
        }
        return val;
      }
    },

用法

      <el-table-column label="金额" align="right" prop="amount" key="amount"
                       :show-overflow-tooltip='true'>
        <template slot-scope="scope">
          {{ formatNumber(scope.row.amount) }}
        </template>
      </el-table-column>

表格统计行

el-table 标签中加入 

show-summary :summary-method="getSummaries"

编写函数

getSummaries

    getSummaries(param) {
      const {columns, data} = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计';
          return;
        }
        const values = data.map(item => Number(item[column.property]));
        if (!values.every(value => isNaN(value))) {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return Math.round((prev + value) * 100) / 100;
            } else {
              return prev;
            }
          }, 0);
          //sums[index] += '';
          // 返回结果显示千分位
          sums[index] = sums[index].toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
        } else {
          sums[index] = '';
        }
      });
      return sums;
    },

                                                                Leslie Lee 随笔 

  • 2
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值