nuxt-i18n 的延迟加载语言环境



在nuxt-i18n中,必须指定locales属性以及应用将支持的区域设置,如下所示:

locales: [
{
code: 'en',
file: 'en-US.js'
},
{
code: 'es',
file: 'es-ES.js'
},
{
code: 'fr',
file: 'fr-FR.js'
}
],

是否可以从 api 端点获取然后填充数组?

我在这个问题 https://github.com/nuxt-community/nuxt-i18n/issues/256#issuecomment-505344965 看到了类似的东西,但我不知道如何运行该代码,甚至不知道这是可能的。

解决方案很简单。Nuxt 允许您将异步函数导出为选项,以便我可以获取数据并将其分配给 i18n 对象。

https://nuxtjs.org/guide/configuration/#asynchronous-configuration

export default async () => {
const data = await getCountries()
const locales = []
for (const locale of data) {
locales.push({
code: locale,
file: `${locale}.json`
})
}
return {
build: {
...
},
env: {
...
},
modules: [
'nuxt-i18n',
...
],
i18n: {
locales,
strategy: 'prefix',
detectBrowserLanguage: false,
lazy: true,
defaultLocale: 'es',
langDir: 'translations/'
},
...
}
}

最新更新