React I18N-从API加载多种语言

Question

我的应用程序将语言存储在数据库中， API管理客户端应根据API请求使用的语言。

API返回具有以下结构的JSON：

{
 "en":{...translations},
 "cn":{...translations},
 "jp":{...translations},
}

目前我以这种方式初始化I18N，

import i18n from "i18next";
import { initReactI18next } from "react-i18next";

import HttpBackend from "i18next-http-backend";
import LanguageDetector from "i18next-browser-languagedetector";
import { languageService } from "services";

const fallbackLng = ["en"];
const { getDictionary } = languageService;

i18n
  .use(HttpBackend) 
  .use(LanguageDetector) 
  .use(initReactI18next) 
  .init({
    fallbackLng,
    backend: {
      allowMultiLoading: true,
      request: (options: any, url: any, payload: any, callback: any) => {
        try {
          getDictionary().then(res => {
            callback(null, {
              data: res,
              status: 200
            });
          });
        } catch (e) {
          console.error(e);
          callback(null, {
            status: 500
          });
        }
      },
    }
  });

export const i18nextConfig = i18n;

但是由此产生的I18N存储，而不是

store: {
  data: {
    en:{...translation },
    cn:{...translation },
  }
}

它的

store: {
  data: {
    en:{ 
      translation:{
        "en":{...translation}, 
        "cn":{...translation}
      }
    }
  }
}

i18n商店结构

我一直在阅读文档，但在这种情况下似乎还不清楚。

Answer 1

您可能还需要使用MultiLoad-backend-aDapter =＆gt;