Question

我需要帮助我收到此错误

./src/components/Header/Header.js
Attempted import error: 'UseTranslation' is not exported from 'react-i18next'.

它是一个新项目，我已逐步安装了https://react.i18next.com 但我在导入 UseTranslation

时遇到了问题

在header.js中，我得到了这个

import { useTranslation } from 'react-i18next';
//style
import "./Header.scss";


class Header extends Component {
  
  render() {


    const { t, i18n } = useTranslation();

    return (
      
      <div className="container-header">
        <div className="container-header__main">
          <div className="container-header__main-overlay">
            <div className="container-header__main-overlay__text">
              <div className="container-header__main-overlay__text__title">
         
                {t('hello')}
              </div>
              <div className="container-header__main-overlay__text__subtitle">
                  {t('hello2')}
              </div>
            </div>
          </div>
        </div>
      </div>
    );
  }
}

export default Header;

这是我的i18n.js，我认为还可以

import i18n from "i18next";
import { reactI18nextModule } from "react-i18next";

import EN from './assets/translation/en.json';
import CZ from './assets/translation/cz.json';

const resources = {
  en: {
    translation: EN
  },
  cz:{
      translation: CZ
  }
};

i18n
  .use(reactI18nextModule) 
  .init({
    resources,
    lng: "en",
    fallbackLng: "en",
    useSuspense: false,

  });

export default i18n;

Answer 1

它用于useTranslation的{{1}}，但是您使用的类组件是hook

Hoc

并在index.js中添加Suspense

import { withTranslation } from 'react-i18next';
   const  {t,i18n} =this.props

  {t('hello2')}
export default withTranslation()(Header);

尝试导入错误：未从“ react-i18next”导出“ useTranslation”

1 个答案: