如何在 VueJS 中格式化数字

Question

我找不到在 VueJS 中格式化数字的方法。我发现的只是用于格式化货币的 内置货币过滤器 和 vue-numeric ，需要进行一些修改才能看起来像一个标签。然后你不能用它来显示迭代的数组成员。

原文由 Buffalo 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

安装 numeric.js ：

 npm install numeral --save

定义自定义过滤器：

 <script>
  var numeral = require("numeral");

  Vue.filter("formatNumber", function (value) {
    return numeral(value).format("0,0"); // displaying other groupings/separators is possible, look at the docs
  });

  export default
  {
    ...
  }
</script>

用它：

 <tr v-for="(item, key, index) in tableRows">
  <td>{{item.integerValue | formatNumber}}</td>
</tr>

原文由 Buffalo 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

Intl.NumberFormat() ，默认用法：

 ...
created: function() {
    let number = 1234567;
    console.log(new Intl.NumberFormat().format(number))
},
...

//console -> 1 234 567

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/NumberFormat

原文由 Naskalin 发布，翻译遵循 CC BY-SA 4.0 许可协议