需要传递代码的执行才能在Java脚本中获得输出
我在Reaction应用程序中使用
translation
的以下代码。它的遗留应用程序。因此它们都是class
组件和旧库。
import i18next from 'i18next';
import React from 'react';
import TransFile from './TransFile.js';
const LanguageDetector = require('i18next-browser-languagedetector');
const initReactI18next = require('react-i18next');
var output;
//API call
apiDelegate.getTranslations().then((result) => {
output = JSON.stringify(result);
alert("output1 =>"+result);
});
alert("output2 is:"+output);
i18next
.use(LanguageDetector)
.use(initReactI18next)
.init({
resources: {
en: output, //Here I need to assign output
},
fallbackLng: 'fr',
});
i18next.changeLanguage(navigator.language);
alert("Output3 is:"+output);
export default i18next;
正在打印output2
的警报,然后是output3
然后是output1
。output2
和output1
是undefined
。我需要按顺序打印它们,因为我需要在应用程序中使用API
数据。它没有赋值给实际变量
基本上,我需要将output
赋给我的en
变量。代码中的下面一行
en: output,
我不能使用async await
,因为babel
不是supporting
,而且它的应用程序太旧了,所以当我更新webpack时失败了。
apiDelegate
代码。
getTranslations() {
var token = sessionStorage.getItem('jwt');
if (token == null) {
token = '';
}
return new Promise((resolve) => {
request
.get(baseUrl.api + '/file_download/en') //API call
.set({
'Content-Type': 'application/json',
Authorization: 'Bearer ' + token,
})
.then((value) => {
var result;
if (value.status === 200) {
result = value.body;
// alert(JSON.stringify(result));
}
resolve(result);
return result;
})
.catch((error) => {
var result;
if (error.status === 401 || error.status === 403) {
result = { status: -2, message: error, data: [] };
}
resolve(result);
});
});
}
可以使用callback
或setTimeOut
完成吗?我知道它的基本知识,但我还是个初学者。不能解决同样的问题。请帮帮忙。
编辑1:- 数据将存储在文件中,或者API输出如下所示。
translation: {
app_header:"My contact",
app_address:"my address",
app_phone:"+1 93244 3223",
app_email:"abc@abc.com"
}
我在我的文件中使用i18,如下所示。
import i18n from '../../../i18'
在组件中,它的用法如下
i18n.t("app_header")
app_header
的SO值将在应用中替换。
解决方案
import i18n from "i18next";
import LanguageDetector from "i18next-browser-languagedetector";
import backend from 'i18next-http-backend';
import api from "../api";
var lang=navigator.language;
let loadResources= apiDelegate.getTranslations(lang);
const backendOptions = {
loadPath: 'http://localhost:8080/code/'+lang,
request: (options, url, payload, callback) => {
try {
loadResources.then((result) => {
callback(null, {
data: result,
status: 200,
});
});
} catch (e) {
console.error(e);
callback(null, {
status: 500,
});
}
},
};
i18n
.use(LanguageDetector)
.use(backend)
.init({
backend: backendOptions,
fallbackLng: "fr",
debug: false,
load:"languageOnly",
ns: ["translations"],
defaultNS: "translations",
keySeparator: false,
interpolation: {
escapeValue: false,
formatSeparator: ","
},
react: {
wait: true
}
});
i18n.changeLanguage(navigator.language);
export default i18n;
相关文章