如何在nuxtjs/i18n中为货币符号与金额添加空格？

问题说明 #

使用Nuxt.js/i18n格式化货币时，当前显示为 $1,739.10，需要实现符号与金额间带空格的效果：$ 1,739.10。

原配置与使用方式 #

nuxt.config.js 中的货币格式化配置 #

numberFormats: {
  'en-US': {
    currency: {
      style: 'currency',
      currency: 'USD',
      currencyDisplay: 'symbol',
      useGrouping: true,
      symbol: '$',
    },
  },
}

原调用方式 #

$i18n.n(173910, 'currency')

解决方法 #

改用 <i18n-n> 组件替代 $i18n.n 方法即可实现需求，示例代码如下：

<i18n-n :value="173910" format="currency"></i18n-n>

内容的提问来源于stack exchange，提问作者nauk