Skip to content

回退机制

使用 fallbackLocale: '<lang>' 来选择在首选语言缺少翻译时要使用的语言。

使用区域设置的隐式回退

如果给定的 locale 包含一个地区和可选的方言,隐式回退会自动激活。

例如 de-DE-bavarian 将按以下顺序回退:

  1. de-DE-bavarian
  2. de-DE
  3. de

要禁用自动回退,请添加后缀感叹号 !,例如 de-DE!

显式回退使用单一区域设置

有时某些项目不会被翻译成某些语言。在此示例中,项目 hello 在英语中有但不在日语中:

js
const messages = {
  en: {
    hello: 'Hello, world!'
  },
  ja: {
  }
}

如果您希望在所需区域设置中没有可用项目时使用(比如说)en 项目,请在 createI18n 中设置 fallbackLocale 选项:

js
const i18n = createI18n({
  locale: 'ja',
  fallbackLocale: 'en',
  messages
})

模板:

html
<p>{{ $t('hello') }}</p>

输出:

html
<p>Hello, world!</p>

默认情况下,回退到 fallbackLocale 会产生两个控制台警告:

txt
[intlify] Not found 'hello' key in 'ja' locale messages.
[intlify] Fall back to translate 'hello' key with 'en' locale.

第一条警告信息是在提供给翻译函数 $t 的键不在 ja 区域消息中时打印的,第二条警告信息在从 en 区域消息中解析本地化消息时出现。这些警告信息用于支持使用 Vue I18n 进行调试。

注意

这些警告信息仅在开发模式下(process.env.NODE_ENV !== 'production')默认显示,生产环境中不显示。

要抑制第一条警告(“未找到键...”),请在传统 API 模式下设置 silentTranslationWarn: true 或在组合 API 模式下初始化 createI18n 时设置 missingWarn: false

要抑制第二条警告(“回退到...”),请在传统 API 模式下设置 silentFallbackWarn: true 或在组合 API 模式下初始化 createI18n 时设置 fallbackWarn: false

显式回退使用区域设置数组

可以使用区域设置数组设置多个回退区域设置。例如

javascript
fallbackLocale: [ 'fr', 'en' ],

显式回退使用决策映射

如果需要更复杂的回退区域设置决策映射,可以通过定义相应的回退区域设置来实现。

使用以下决策映射:

javascript
fallbackLocale: {
  /* 1 */ 'de-CH':   ['fr', 'it'],
  /* 2 */ 'zh-Hant': ['zh-Hans'],
  /* 3 */ 'es-CL':   ['es-AR'],
  /* 4 */ 'es':      ['en-GB'],
  /* 5 */ 'pt':      ['es-AR'],
  /* 6 */ 'default': ['en', 'da']
},

将导致以下回退链:

区域设置回退链
'de-CH'de-CH > fr > it > en > da
'de'de > en > da
'zh-Hant'zh-Hant > zh-Hans > zh > en > da
'es-SP'es-SP > es > en-GB > en > da
'es-SP!'es-SP > en > da
'fr'fr > en > da
'pt-BR'pt-BR > pt > es-AR > es > en-GB > en > da
'es-CL'es-CL > es-AR > es > en-GB > en > da

回退插值

设置 fallbackFormat: true 以在语言缺少某个键的翻译时对翻译键进行模板插值。

由于翻译键是字符串,您可以使用用户可读的消息(特定语言)作为键。 例如:

javascript
const messages = {
  ja: {
    'Hello, world!': '你好,世界!'
  }
}

这很有用,因为您不必为字符串 "Hello, world!" 指定英语翻译。

实际上,您甚至可以在键中包含模板参数。配合 fallbackFormat: true,这可以让您跳过编写基础语言的模板;键本身就是您的模板。

javascript
const messages = {
  ru: {
    'Hello {name}': 'Здравствуйте {name}'
  }
}

const i18n = createI18n({
  locale: 'ru',
  fallbackLocale: 'en',
  fallbackFormat: true,
  messages
})

当模板如下所示:

html
<p>{{ $t('Hello {name}', { name: 'John' }) }}</p>
<p>{{ $t('The weather today is {condition}!', { condition: 'sunny' }) }}</p>

将输出:

html
<p>Здравствуйте, John</p>
<p>The weather today is sunny!</p>