1

我正在制作一个从后端获取数据并显示在浏览器中的反应应用程序。为了更改静态名称的语言(如页眉、页脚),如果我在公共文件夹中设置 locales 文件夹,并为所需的语言代码创建所有 json 文件,则会更改。

现在,我也想从后端加载翻译文件,因为从后端获取的数据总是随机的,后端会发送相应的翻译文件。

我对如何实现这一目标感到非常困惑。

我经历了很多 stackoverflow 解决方案,建议使用自定义后端插件。但是,我很困惑如何创建自定义后端插件。

这是我的 i18next.js 配置的代码部分:

import i18n from 'i18next';
import {  initReactI18next } from 'react-i18next';
import Backend from 'i18next-http-backend';

i18n
.use(initReactI18next)
.use(Backend)
.init({
    ns:['common', 'translation'],
    defaultNS : 'common',
//still loads the translation files if I do not define below line (because it is in public folder in react app)
    backend: { loadPath: "/locales/{{lng}}/{{ns}}.json" }
});

从上面的代码中,我只能加载前端的翻译文件。如果我将“后端”行更改为:

backend : { loadPath : "http://localhost:5000/locales/{{lng}}/{{ns}}.json"

它将从 localhost:5000 的后端服务器加载翻译文件。但是,位于公共文件夹中的翻译文件现在未加载。

谁能帮忙举个例子,如何加载两个路径,以便前端和后端的翻译文件都能正常工作。

4

1 回答 1

0

当您在本地项目和后端翻译中都定义了资源时,您就可以使用i18next-chained-backend库来支持两者。请参阅此处的简短示例。

参考:https ://www.i18next.com/how-to/add-or-load-translations

于 2021-09-22T07:27:24.757 回答