react-i18next - 如何在 BASIC 函数(非组件)中使用 react-i18next？

Question

我知道 react-i18next 在每个组件中都可以工作:函数式(使用 useTranslation)和类组件(使用 withTranslation())但是我不能在这样的基本函数中使用翻译:

const not_a_component = () => {
  const { t } = useTranslation();
  return t('translation')
};

const translate = not_a_component();

错误钩子(Hook)!

谢谢 !

Answer 1

你可以使用 i18next使用javascript进行翻译的库。react-i18next只是 i18next 之上的一个包装库.

如果您已经在使用 react-i18next，下面是一个示例它已配置。

import i18next from "i18next";

const not_a_component = () => {
  const result = i18next.t("key");
  console.log(result);
  return result;
};

export default not_a_component;

如果您选择仅使用 i18next那么你可以简单地得到 t功能。
这一切都取决于您的要求。

import i18next from 'i18next';

i18next.init({
  lng: 'en',
  debug: true,
  resources: {
    en: {
      translation: {
        "key": "hello world"
      }
    }
  }
}, function(err, t) {
  // You get the `t` function here.
  document.getElementById('output').innerHTML = i18next.t('key');
});

希望有帮助!!!