몇 주 전에 나온 React Router의 새로운 useHistory 후크를 사용하고 있습니다. 내 React-router 버전은 5.1.2입니다. 내 반응은 버전 16.10.1입니다. 하단에서 내 코드를 찾을 수 있습니다.
그러나 반응 라우터에서 새 useHistory를 가져올 때 다음 오류가 발생합니다.
Uncaught TypeError: Cannot read property 'history' of undefined
이것은 React-router 에서이 줄로 인해 발생합니다
function useHistory() {
if (process.env.NODE_ENV !== "production") {
!(typeof useContext === "function") ? process.env.NODE_ENV !== "production" ? invariant(false, "You must use React >= 16.8 in order to use useHistory()") : invariant(false) : void 0;
}
return useContext(context).history; <---------------- ERROR IS ON THIS LINE !!!!!!!!!!!!!!!!!
}useContext와 관련이 있고 컨텍스트와의 충돌이 잘못되었을 수 있으므로 useContext에 대한 모든 호출을 완전히 제거하고 공급자를 만드는 등을 시도했지만 아무것도하지 않았습니다. React v16.8로 시도; 같은 것. React 라우터의 다른 모든 기능이 제대로 작동하기 때문에이 원인을 알 수 없습니다.
*** useLocation 또는 useParams와 같은 다른 React 라우터 후크를 호출 할 때도 마찬가지입니다.
다른 사람이 이것을 만났습니까? 이것이 발생할 수있는 아이디어가 있습니까? 이 문제와 관련하여 웹에서 아무것도 발견하지 못했기 때문에 도움을 주시면 감사하겠습니다.
import React, {useEffect, useContext} from 'react';
import { BrowserRouter as Router, Route, Link } from "react-router-dom";
import { Switch, useHistory } from 'react-router'
import { useTranslation } from 'react-i18next';
import lazyLoader from 'CommonApp/components/misc/lazyLoader';
import {AppContext} from 'CommonApp/context/context';
export default function App(props) {
const { i18n } = useTranslation();
const { language } = useContext(AppContext);
let history = useHistory();
useEffect(() => {
i18n.changeLanguage(language);
}, []);
return(
<Router>
<Route path="/">
<div className={testClass}>HEADER</div>
</Route>
</Router>
)
}