Question

我一直在尝试通过使用下面链接中的代码来实现react-i18next（10.9.0）：

https://codesandbox.io/s/l23no88qmz?from-embed

但是我得到了错误：

Attempted import error: 'translate' is not exported from 'react-i18next'.

从[https://github.com/i18next/react-i18next/issues/810开始，我知道v8中使用了“翻译”，而v10中使用了钩子。

我想知道是否可以在不使用钩子的情况下使用react-i18next（10.9.0）？如果是，我应该用什么代替“翻译”？

Answer 1

react-i18next v10经过专门重构，可以与钩子一起使用，因此您需要调整代码以支持钩子，或者使用旧版v9版本。

Answer 2

您可以将钩子转换为道具并将其发送到组件。

import {useTranslation} from 'react-i18next';

class XXX extends React.Component {
    render() {
          const {i18nTranslation} = this.props;

          return <div>{i18nTranslation.t('welcome.msg')}</div>
    }
}

export default connect(mapStateToProps, mapDispatchToProps)(function (props) {
     const i18nTranslation = useTranslation();
     return <XXX {...props} i18nTranslation={i18nTranslation} />
});

react-i18next v10不带挂钩

2 个答案: