数字本地化

支持版本

🆕 7.0 新增

你可以使用你定义的格式来本地化数字。

数字格式如下：

  1. const numberFormats = {
  2.   'en-US': {
  3.     currency: {
  4.       style: 'currency', currency: 'USD'
  5.     }
  6.   },
  7.   'ja-JP': {
  8.     currency: {
  9.       style: 'currency', currency: 'JPY', currencyDisplay: 'symbol'
  10.     }
  11.   }
  12. }

如上，你可以指定具名的 (例如：currency 等) 的数字格式，并且需要使用 ECMA-402 Intl.NumberFormat 的选项数字本地化 - 图1。

之后就像语言环境信息一样，你需要指定 VueI18n 构造函数的 numberFormats 选项：

  1. const i18n = new VueI18n({
  2.   numberFormats
  3. })
  5. new Vue({
  6.   i18n
  7. }).$mount('#app')

模板如下：

  1. <div id="app">
  2.   <p>{{ $n(100, 'currency') }}</p>
  3.   <p>{{ $n(100, 'currency', 'ja-JP') }}</p>
  4. </div>

输出如下：

  1. <div id="app">
  2.   <p>$100.00</p>
  3.   <p>￥100</p>
  4. </div>