react-i18next翻译不适用于传递的Prop元素

Question

我在我的项目中设置了一个i18转换器，虽然它对项目中的其他元素运行良好，但它似乎对传递的prop元素不太好。

这就是我使用i18:的方式

import { useTranslation } from 'react-i18next';
const { t } = useTranslation();
//Using the translations
{t('kitchenware')} // <-- Working fine
{t(product?.name)} // <-- Error here
name={t(product.name)} // <-- No error, but translations doesn't seem to work

这是我收到的错误消息：

src/pages/product/index.tsx:48:33
TS2769: No overload matches this call.
Overload 1 of 2, '(key: string | TemplateStringsArray | (string | TemplateStringsArray)[], options?: string | TOptions<StringMap> | undefined): TFunctionResult', gave the following error.
Argument of type 'string | undefined' is not assignable to parameter of type 'string | TemplateStringsArray | (string | TemplateStringsArray)[]'.
Type 'undefined' is not assignable to type 'string | TemplateStringsArray | (string | TemplateStringsArray)[]'.
Overload 2 of 2, '(key: string | TemplateStringsArray | (string | TemplateStringsArray)[], defaultValue?: string | undefined, options?: string | TOptions<StringMap> | undefined): TFunctionResult', gave the following error.
Argument of type 'string | undefined' is not assignable to parameter of type 'string | TemplateStringsArray | (string | TemplateStringsArray)[]'.

我将确保始终传递一个乘积值，而不是未定义或null。

Answer 1

我错误地引用了i18脚本。经过正确的参考后，这已经起作用了。