React i18next - не показывать переводы до завершения запроса - PullRequest
0 голосов
/ 25 марта 2020

Я получаю информацию о языке из бэкэнда. Я хотел бы сделать запрос, чтобы получить информацию о языке, а затем дать сигнал i18next, что он может показывать переводы. В настоящее время он показывает языковые переводы по умолчанию на секунду, пока запрос не закончится, и я не позвоню i18next.changeLanguage().

Как бы мне этого добиться?

Это моя конфигурация:

import i18n from "i18next";
import { initReactI18next } from "react-i18next";
import XHR from "i18next-xhr-backend";

 i18n
  .use(initReactI18next)
  .use(XHR)
  .init({
    fallbackLng: "en-GB",
    keySeparator: false,
    interpolation: {
      escapeValue: false
    },
    backend: {
      loadPath: "/locales/{{lng}}.json"
    }
  });

Я использую хук useTranslation, чтобы получить функцию t:

 const { t } = useTranslation();

1 Ответ

0 голосов
/ 31 марта 2020

В случае реакции-i18next убедитесь, что useSuspense включен, или обработайте состояние готовности в HOC или перехватываете себя.

Вам необходимо обернуть root компонент Suspense компонент для определения того, что следует отображать во время загрузки переводов.

import React, { Suspense } from 'react';
import RealApp from './App';
import Loading from './Loading';
import { I18nextProvider } from 'react-i18next';
import App from './App';

function Root(props) {
  return (
    <Suspense fallback={<Loading />}>
      <I18nextProvider i18n={i18n}>
        <Root />
      </I18nextProvider>
    </Suspense>
  );
}

Для получения дополнительной информации info .

...