我正在使用React-i18next库,我需要在函数内部获得翻译函数t()
。
export function translateCell(cell) {
const { t } = useTranslation();
return (t(cell));
}
当使用useTranslation()
时,它失败并出错
钩子只能在函数组件的主体内部调用。
我尝试在初始化中使用I18nextProvider
和.use(initReactI18next)
,但两种设置都会产生相同的错误。
我是以错误的方式使用它,还是我误解了什么?
编辑:我发现,只有作为组件呈现的函数才能使用useTranslation。喜欢
function export MyComponent (cell) {
const { t } = useTranslation();
return (<div>{t(cell)}</div>);
}
...
render(){
<MyComponent/>
我在初始化后找到了导出i18n对象的解决方案,并在我需要的所有其他地方使用它。
文件i18nSetup.js:
i18n
.use(initReactI18next)
.init({
resources: translationResources,
interpolation: {
escapeValue: false
}
});
export default i18n;
在其他文件中:
import i18n from "../functions/i18nSetup";
export function translateCell(cell) {
return (i18n.t(cell));
}