Nuxtjs i18n 区域设置在静态生成页面的第一次加载时始终设置为 'en'

Question

我在我的网站中使用 Nuxt i18n 模块来获取本地化内容。

我在nuxt.config.js中设置如下：

[
  'nuxt-i18n',
  {
    locales: ['en', 'fr', 'ar'],
    defaultLocale: 'en',
    strategy: 'prefix',
    vueI18n: {
      fallbackLocale: 'en',
      messages: {
        en: {
          welcome: 'Welcome'
        },
        fr: {
          welcome: 'Bienvenue'
        },
        ar: {
          welcome: 'أهلا بك'
        }
      }
    }
  }
]

完成以下操作后：

npm run generate
npm run start

并在我尝试访问的浏览器中清除网站数据：

http://localhost:3000/ar/

语言环境设置为 'en'，我被重定向到

http://localhost:3000/en/

但是现在，如果我再次尝试将语言环境设置为 'ar'，页面将加载正确的语言环境（在本例中：'http://localhost:3000/ar/'）

我还尝试将 defaultLocale 和 fallbackLocale 设置为 'ar' 而不是 'en' 并再次测试所有内容。但是我得到了相同的结果。

非常感谢任何关于为什么会发生这种情况以及如何解决它的建议或想法。提前谢谢你

Answer 1

Nuxt i18N 首先尝试检测首选语言运行，这可能意味着您的浏览器语言设置为英语。

这是此脚本的默认工作方式，可以进行其他配置：https://i18n.nuxtjs.org/browser-language-detection。

一旦您更改为另一种语言，设置就会存储在 cookie 中。

如果您必须能够向您的客户等发送本地化链接（/ar/ 等），您可以使用 URL 参数：例如 ?lang=es。您可以创建一个小的 onMounted() 脚本来检查页面加载时参数是否存在于 url 中，如果存在，它会强制从默认 url 重定向到 URL你想分享。

Nuxtjs i18n 区域设置在静态生成页面的第一次加载时始终设置为 'en'

Nuxtjs i18n locale is always set to 'en' on the first load of a static generated page

nuxt.js

nuxt-i18n