路径检测不适用于react i18Next

Question

我的代码是这样的，但是当我进入localhost/fr时，它不是从路径中检测到语言吗？我在这里做错什么了？

import { initReactI18next } from "react-i18next";
import LanguageDetector from "i18next-browser-languagedetector";
import HttpApi from "i18next-http-backend";

i18n
  .use(HttpApi)
  .use(LanguageDetector)
  .use(initReactI18next)
  .init({
    supportedLngs: ["en", "fr"],
    // lng: "en",
    fallbackLng: "en",
    detection: {
      order: ["path", "querystring", "cookie"],
      lookupFromPathIndex: 0,
      lookupQuerystring: "lng",
      caches: ["cookie"],
    },
    backend: {
      loadPath: "/assets/locales/{{lng}}/translation.json",
    },
    // react: { useSuspense: false },
  });

export default i18n;

Answer 1

您需要以以下方式使用localhost?lng=fr

来自LanguageDetector包文档

这是一个i18next语言检测插件，用于检测浏览器中的用户语言，支持：

1. cookie (set cookie i18next=LANGUAGE) sessionStorage (set key )
2. ( i18nextLng=LANGUAGE) localStorage (set key i18nextLng=LANGUAGE)
3. 导航器(设置浏览器语言) querystring (附加?lng=LANGUAGE到URL) htmlTag (添加html语言标记
4. (http://my.site.com/LANGUAGE/...)子域
5. (http://LANGUAGE.site.com/...)

我试着使用localhost:3000?lng=fr，这对我很有用。如果这对你有用的话请告诉我。localhost:3000是create应用程序运行的URL。