reactjs - 我在 react 18 中遇到 i18next 问题

Question

我不能在标签内使用 i18n 中的 t(也不能在任何 html 标签内使用)而且我无法弄清楚为什么，如果我在 jsx 中的标签外使用它，它可以正常工作并从我的 json 文件中获取翻译。

代码示例: <label htmlFor={"username"}>{t("Username")}</label>

我收到错误信息:类型“DefaultTFuncReturn”不可分配给类型“ReactI18NextChild |可迭代'。类型“object”不可分配给类型“ReactI18NextChild |可迭代'。

有没有人遇到过类似的问题，你知道怎么解决吗？

Answer 1

我回答了这个here也可以在这里分享。

我遇到了同样的问题并在 official docs here 中找到了修复方法. i18next 的 t 方法可以返回一个 null 值，但最近才反射(reflect)在类型中。需要防止 null 返回。找到您的 i18n 配置，可能名为 i18n.ts。

// i18n.ts
import 'i18next';

// declare custom type options so the return is always a string.

declare module 'i18next' {
  interface CustomTypeOptions {
    returnNull: false
  }
}

// update the initialization so the behavior matches the type:
i18next.init({
  returnNull: false,
  // ... any other initializations here
});