React Router V4 (react-router-dom)는 프로그래밍 방식으로 트리 내에서 탐색합니다.

Question

나는 the following post을 확인했습니다.하지만 내 문제를 해결하기 위해 여러 가지 해결책을 제시하지는 않습니다.

반응 라우터 V4를 사용하면 프로그래밍 방식으로 구성 요소에서 깊이있는 내부 트리 내 은에 전달 된 라우터 소품 (기록, URL, 매개 변수 등)에 액세스 할 수 없습니다. 가장 직접적인 방법은 무엇입니까?

import history from 'path/to/history.js' 

... 
someFoo(){ 
    history.push({ 
    pathname: '/new/url', 
    }) 
} 
... 

당신은 또한 확인해야합니다 : 다른 구성 요소의

import createHistory from 'history/createBrowserHistory' 
const history = createHistory() 
export default history 

다음을 :

Answer 1

모두 구성 요소가 깊이에 관계없이 history, location 및 match 소품에 액세스 할 수 있습니다 (react-router에 의해 사용됨). 이 작업을 수행하려면 react-router에 의해 제공되는 withRouter HOC의 구성 요소를 래핑해야합니다.

코드 :

//other imports 
import {withRouter} from 'react-router-dom' 

//define component MyComponent here 

export default withRouter(MyComponent); 

내부를 MyComponent 당신은 당신이 시도 무엇 https://reacttraining.com/react-router/web/api/withRouter

Answer 2

가장 정직 방법은 너무

history.js처럼 별도의 파일로 역사를 이동하는 것입니다 라우터에 새로운 기록을 전달하여 올바르게 작동하도록하십시오.