Nuxt + Laravel上的多语言站点，来自后端的语言环境 [英] Multilingual site on Nuxt + Laravel with locales from backend

问题描述

我正在 Nuxt + Laravel 上建立一个多语言站点.我想有一个选项来设置数据库中的语言环境，并将这些语言环境共享到 Nuxt 前面.有可能吗?

I am making a multilingual site on Nuxt + Laravel. I want to have an option to set locales in the database and share these locales to Nuxt front. Is it possible?

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

I found Nuxt plugin nuxt-i18n which looks good, but locales are set in nuxt.config.js file and you cannot set data from api response in this file.

推荐答案

您可以在 nuxt-i18n

首先，为类似于以下内容的语言创建结构:

First, create a structure for languages similar to this:

nuxt-project/
├── lang/
│   ├── en-US.js
│   ├── es-ES.js
│   ├── fr-FR.js
├── nuxt.config.js

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

Then set the nuxt.config configuration. Note that you need to set lazy: true and the 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，如下所示:

Then, inside the lang files you can call your API and return the json with the translation messages, like this:

// 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
    })
  });
}

您可以在文档

这篇关于Nuxt + Laravel上的多语言站点，来自后端的语言环境的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！