千分位数据处理

71 阅读1分钟

第一个

// vue里面直接输入校验规则
  <span>{{
            Number(scope.row[item.prop]).toFixed(2).toString().replace(/(\d{1,3})(?=(\d{3})+(?:$|\.))/g, "$1,")   }}</span>

        

第二个 element ui table

<el-table-column prop="address" label="地址" :formatter="stateFormat">
stateFormat(row, column, cellValue) {
            cellValue += '';
            if (!cellValue.includes('.')) cellValue += '.';
            return cellValue.replace(/(\d)(?=(\d{3})+\.)/g, function ($0, $1) {
                return $1 + ',';
            }).replace(/\.$/, '');
        },

第三个 filter使用



  <el-table-column
            v-for="(item,index) in columns"
            :key="index"
            :prop="item.prop"
            :label="item.label"
            :header-align="item.headeralign"
            :align="item.align"
            :fixed="item.fixed"
            :min-width="item.minwidth"
            :sortable="item.sortable"
            :show-overflow-tooltip="item.tooltip == false ? false : true"
          >
            <template slot-scope="scope">
            

              <span v-if="item.filter=='toThousands'">{{ scope.row[item.prop]|toThousands }}</span>
              <span v-else>{{scope.row[item.prop]}}</span>
            </template>
          </el-table-column>

  filters: {
    toThousands(num) {
      return Number(num)
        .toFixed(2)
        .toString()
        .replace(/(\d{1,3})(?=(\d{3})+(?:$|\.))/g, "$1,");
    }
  },