사용내역 react-router-dom 잘못된 후크 호출

사용내역 react-router-dom 잘못된 후크 호출

나는 실행하려고 한다.useHistory에서 낚아채다.react-router-dom효과가 없는 것 같아잘못된 후크 호출 발생

앱.js

import React, { Component } from 'react';
<...>
import { Signup } from './Signup.js';
import { Login } from './Login.js';
import { Account } from './Account.js';
import { AuthProvider } from './contexts/AuthContext.js';
import { BrowserRouter as Router, Switch, Route } from 'react-router-dom';

class App extends Component {
    <...>

    render() {
        return(
            <>
               <...>
                <Router>
                    <AuthProvider>
                        <Switch>
                            <Route exact path="/" component={Signup} />
                            <Route path="/signup" component={Signup} />
                            <Route path="/login" component={Login} />
                            <Route path="/account" component={Account} />
                        </Switch>
                    </AuthProvider>
                </Router>
            </>
        );
    }
}

export default App;

계정.js

import React from 'react';
import { useHistory } from 'react-router-dom';

export const Account = () => {
    const history = useHistory();
    return(
        <h1>Hello...</h1>
    );
}

그리고 그것은 이 선에 오류를 발생시킨다.const history = useHistory();

오류: 잘못된 후크 호출. 후크는 기능 구성 요소의 신체 내부에서만 호출할 수 있다. 이런 일이 일어날 수 있는 이유는 다음과 같은 한 가지 때문이다. <...>

최신 리액트 버전, 최신 리액트 라우터 버전, 설치한 경우react-router-dom다음에create-react-app. 링크 및 경로 자체는 문제 없이 작동하고 있다.여기서 이 문제에 대한 몇 가지 주제를 찾았지만 명확하고 효과적인 해결책은 찾지 못했다.감사합니다.

해결책 찾기: 이전에 MacOS 터미널에서 react-router-dom을 직접 설치했고 useHistory를 제외한 모든 것이 작동했지만, 이번에는 VS 코드 터미널에서 react-router-dom을 직접 설치했고 지금은 잘 작동하는 것 같다.이것이 이 문제를 가지고 있는 누군가에게 도움이 되기를 바란다.

내 경우는 다른 곳에서 찾을 수 없는 무언가에 의해 오류가 발생한 것이다.

예를 들어, 나는 다음과 같은 것을 사용하고 있었다.

<Route path="/signup" children={Signup} />
// So I changed it to
<Route path="/signup" component={Signup} />

공지component을 지지하다<Route />

구성 요소가 구성 요소를 호출하고 아이들이 추가하기 때문에 응답 및/또는 후크를 두 번 호출하기 때문에 오류가 발생한 것으로 생각한다.

아는 사람이 있고 더 잘 설명할 수 있다면, 얼마든지 그렇게 하시오!

나는 소포를 확인했다.json 그리고 내가 몰랐다는 것을 알아차렸다.npm install react-router-dom.

참조URL: https://stackoverflow.com/questions/65528749/usehistory-react-router-dom-invalid-hook-call