Nuxt + Laravel 上的多语言站点，带有后端的语言环境

Question

我正在Nuxt+上制作一个多语言网站Laravel。我希望有一个选项可以在数据库中设置语言环境并将这些语言环境共享到Nuxt前面。是否可以？

我发现Nuxt插件nuxt-i18n看起来不错，但语言环境是在nuxt.config.js文件中设置的，您无法在此文件中设置来自 api 响应的数据。

Answer 1

您可以在nuxt-i18n 中使用延迟加载翻译

首先，为与此类似的语言创建一个结构：

nuxt-project/
??? lang/
?   ??? en-US.js
?   ??? es-ES.js
?   ??? fr-FR.js
??? nuxt.config.js

然后设置nuxt.config配置。请注意，您需要设置lazy: true和langDir

// nuxt.config.js

['nuxt-i18n', {
  locales: [
    {
      code: 'en',
      file: 'en-US.js'
    },
    {
      code: 'es',
      file: 'es-ES.js'
    },
    {
      code: 'fr',
      file: 'fr-FR.js'
    }
  ],
  lazy: true,
  langDir: 'lang/'
}]

然后，在 lang 文件中，您可以调用 API 并返回带有翻译消息的 json，如下所示：

// lang/[lang].js

export default (context) => {
  return new Promise(function (resolve) {
    //Call your API and resolve the content here
    resolve({
      //The JSON return from your API
    })
  });
}

您可以在文档中找到更多详细信息