nuxt-i18n 策略：no_prefix答案

【问题标题】：nuxt-i18n Strategy:no_prefixnuxt-i18n 策略：no_prefix
【发布时间】：2020-03-19 14:14:54
【问题描述】：

我正在尝试使用 nuxt-i18n 为我的应用程序实现国际化，以下是 nuxt-i18n 配置，它工作正常，但是当我想使用策略时：'no_prefix' 它给出了错误......不是确定该怎么做，请提出建议。

i18n: {
    //strategy: 'no_prefix',
    defaultLocale: 'en',
    locales: [
      {
        code: 'en',
        name: 'English',
        iso: 'en-US',
        file: 'english.js'
      },
      {
        code: 'hi',
        name: 'Hindi',
        file: 'hindi.js'
      }
    ],
    lazy: true,
    langDir: 'static/locales/'
  },

https://nuxt-community.github.io/nuxt-i18n/routing.html#strategy

WARN [nuxt-i18n] 将非当前语言环境传递给 switchLocalePath 是使用 no_prefix 策略时不受支持
19:39:39

WARN [nuxt-i18n] 将非当前语言环境传递给 localePath 是使用 no_prefix 策略时不受支持
19:39:39

【问题讨论】：

标签： nuxt.js vue-i18n nuxt-i18n

【解决方案1】：

如果您使用no_prefix 策略，您将无法获得使用模块提供的path 函数的好处。例如，使用no_prefix 时不支持这两个switchLocalePath 和localePath。正如文档所说：

This implies that you have to rely on browser & cookie detection, and implement locale switches by calling the i18n API.

因此，您应该使用模块提供的 API 来更改语言环境。我的项目中的一个例子是，当用户想要更改语言环境时，我添加了一个处理程序并通过调用它来更改语言环境：

this.$i18n.setLocale('en')

或

root.$i18n.setLocale(langCode)（如果使用 composition-api）

【讨论】：

this.$18n 在创建方法时不可用。至少在我的情况下......我选择了@click="$i18n.setLocale('en')"
@AndréKelling 如果您在template 内访问，那么this 将无法访问。
@AndréKelling valid1() { return this.$i18n.setLocale('en') } 可以，valid2: function () { return this.$i18n.setLocale('en') } 也可以，但invalid: () => this.$i18n.setLocale('en') 不行。
@sixty-nine 在箭头函数中使用this 可能会引起混淆
@praburangki 这就是为什么第三个函数被称为无效:)