reactjs - react-i18next - 导入 i18n 实例并直接使用与使用 useTranslation Hook

Question

我有一个用 React & support hooks 编写的项目。
我正在尝试使用 react-i18next 来支持翻译。
一切正常，因为我遵循了文档。
但是，当我想使用 t() 时，我偶然发现了一些问题。对助手/非组件 .js 文件起作用。
然后，我通过直接从init文件./i18n.ts导入i18n来解决它看起来像这样

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

i18n
  .use(initReactI18next) 
  .init({
    resources,

    ns: [
      'common',
      'dashboard',
      'landing'
    ],
    defaultNS: 'common',

    fallbackLng: 'en',
    supportedLngs: ['de', 'en'],
    interpolation: {
      escapeValue: false, 
    },
  });

export default i18n;

我意识到我根本不需要使用钩子(Hook)，因为我可以像这样在代码中使用它，甚至在我的功能组件文件上

import i18n from "@root/i18n"

...
i18n.t('namespace:path')

我想知道为什么推荐使用 useTranslation Hook / withTranslation HOC如果你可以像这样导入它？
我读到 useTranslation应用悬念，但看起来像 initReactI18next默认情况下也应用了悬念。
我很好奇不使用推荐的钩子(Hook)/HOC 是否有任何副作用？

Answer 1

我找到了this回答他们的github问题。

But those constants never will be updated on languageChange! Soeither:

update them to new language value based on event triggered by i18next: https://www.i18next.com/overview/api#onlanguagechanged
or better have only the keys in the constants and translate as close to the rendering as possible