我在react/Javascript下面的檔案中遇到一個奇怪的問題，從呼叫資料backend API并將其分配以進行翻譯。
import i18next from 'i18next';
import apiDelegate from '../src/components/Utils/Common/api.js';
const LanguageDetector = require('i18next-browser-languagedetector');
const initReactI18next = require('react-i18next');
var output;
//API call
apiDelegate.getTranslations().then((result) => {
output = JSON.stringify(result);
const tr_fr = 'translation: ' JSON.parse(output) ;
alert(tr_fr);
i18next
.use(LanguageDetector)
.use(initReactI18next)
.init({
resources: {
en: tr_fr,
},
fallbackLng: 'fr',
});
i18next.changeLanguage(navigator.language);
});
export default i18next;
下面的行用于呼叫 backedn API。
apiDelegate.getTranslations()
它以key value. 對于 ex {name:"Mahima",company:"Infosys",address:"Bangalore India"}
，我在react componenet下面的行中使用這些屬性。
i18n.t("name");
i18n.t("company") 等等
是否有可能在完成執行之前在我的組件中讀取這些值。我apiDelegate()的意思是有可能在執行完成之前code使用檔案。i18因為它沒有反映values. 而不是API如果我使用static filesthen 它可以完美運行。
請幫助我，我很難理解這一點。可以解決嗎？
uj5u.com熱心網友回復：
如果你需要你的消費者等到語言設定好，你可以從這個模塊回傳一個承諾。就像是：
let ready = false;
const start = () => {
return new Promise((res) => {
if (ready) return res(i18next);
apiDelegate.getTranslations().then((result) => {
output = JSON.stringify(result);
const tr_fr = 'translation: ' JSON.parse(output);
i18next
.use(LanguageDetector)
.use(initReactI18next)
.init({
resources: {
en: tr_fr,
},
fallbackLng: 'fr',
});
i18next.changeLanguage(navigator.language);
});
ready = true;
return res(i18next);
});
};
export default start;
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/419445.html
標籤：