提问人：Javad-M 提问时间：9/20/2023 最后编辑：Javad-M 更新时间：11/5/2023 访问量：53
对每种语言使用多个 Json 文件翻译 by reactjs i18next translation
Use multiple Json files for each language translation by reactjs i18next translation
问：
我的 reactjs 项目中有一个名为“en.json”的 json 文件，以便使用 i18next 翻译：
"Ascending": "Ascending",
"Descending": "Descending",
"All": "All",
"job-types": {
"remote": "remote",
"temporary": "temporary",
"fulltime": "fulltime",
"parttime": "parttime"
},
...
}
我想在另一个 json 文件中插入“job-types”项，然后在我当前的“en.json”文件中引用它。是否可以使用嵌套的json文件，或者有什么方法可以解决这个问题？如果是，请问如何？
在 i18n.js 文件中，我有：
const resources = {
en: {
translation: translationEN
},
fa: {
translation: translationFA
},
ar: {
translation: translationAR
}
};
i18n
.use(Backend)
.use(LanguageDetector)
.use(initReactI18next)
.init({
resources,
fallbackLng: 'en',
debug: true,
interpolation: {
escapeValue: false, // not needed for react as it escapes by default
}
});
export default i18n;
translationEN、translationFA 和 translationAR 是导入的.json文件（到 i18n.js），适用于所需的语言，即英语、波斯语或波斯语和阿拉伯语。
答：
0赞
Ron Strauss
9/20/2023
#1
为了引用 JSON 文件中的键，您首先需要使用 这样才能遍历对象。JSON.parse()
const myResponse = JSON.parse(response);
const jobTypes = myResponse['job-types'] // dashed keys must be accessed through an index
如果您需要访问该文件，请链接到它：
const myResponse = await fetch('path/to/file.json');
const jsonBody = await myResponse.json();
otherObject.jobTypes = jsonBody['job-types'];
JSON 不支持链接到其他文件，因为它只是文本。您可以将文件的位置作为值发送，但这是您可以获得的最远位置。
希望这会有所帮助。
0赞
Javad-M
9/27/2023
#2
最后，为了在不复杂的情况下使用翻译 json 文件，我为每种语言使用了两个或多个.json文件并将它们连接起来，而不是按以下方式嵌套它们：
const resources = {
en: {
translation: { ...translationEN, ...translationEN1}
},
fa: {
translation: { ...translationFA, ...translationFA1}
},
ar: {
translation: { ...translationAR, ...translationAR1}
}
};
i18n
.use(Backend)
.use(LanguageDetector)
.use(initReactI18next)
.init({
resources,
fallbackLng: 'en',
debug: true,
interpolation: {
escapeValue: false, // not needed for react as it escapes by default
}
});
export default i18n;
第一个 json 文件：
{
"Ascending": "Ascending",
"Descending": "Descending",
"All": "All",
...
}
和另一个 JSON 文件：
{
"job-types": {
"remote": "remote",
"temporary": "temporary",
"fulltime": "fulltime",
"parttime": "parttime"
}
}
评论