需要传递代码的执行才能在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然后是output1output2output1undefined。我需要按顺序打印它们,因为我需要在应用程序中使用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);
        });
    });
  }

可以使用callbacksetTimeOut完成吗?我知道它的基本知识,但我还是个初学者。不能解决同样的问题。请帮帮忙。

编辑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;

相关文章