首页 > 解决方案 > 在 vue i18n 中分别使用数字和消息本地化

问题描述

我想使用 Vue I18n 为我的网络应用程序进行货币、日期和消息本地化。用户可以单独配置语言和使用的货币格式。例如:一位德国用户想要一个英文本地化网站,但货币格式应为 EUR 和“de-DE”。

是否可以使用 Vue I18n 构建它?像货币的单独语言环境配置?

我可以在模板中传递 BCP 47 语言代码,但是我必须为每个组件加载当前配置的语言代码。我想更动态地解决这个问题。

<p>{{ $n(price, 'currency', currentLanguageCode) }}</p>

const numberFormats = {
    'en-US': {
        currency: {
            style: 'currency', currency: 'USD'
        }
    },
    'de-DE': {
        currency: {
            style: 'currency', currency: 'EUR'
        }
    },
    'de-CH': {
        currency: {
            style: 'currency', currency: 'CHF'
        }
    }
}

const i18n = new VueI18n({
    numberFormats,
    messages: {
        en: {
            test: 'test message'
        },
        de: {
            test: 'Testnachricht'
        }
    },
    locale: 'de',
    fallbackLocale: 'de'
})

标签: javascripttypescriptvue.jsvue-i18n

解决方案


推荐阅读