Ract Router에서 브라우저 기록 푸시를 사용할 때 경로 매개 변수를 전달하는 방법

Ract Router에서 브라우저 기록 푸시를 사용할 때 경로 매개 변수를 전달하는 방법

새로운 버전의 Ract Router를 사용하여 브라우저History.push()를 사용하여 전환 중인 경로로 매개 변수를 전달하는 방법은?만약 브라우저 히스토리가 이것을 허용하지 않는다면, 나는 전환하기 위한 다른 방법을 사용할 용의가 있다.React Router의 상위 하위 구성 요소에는 this.props.routeParams가 있지만 전환 시 이전 경로에서 원하는 값으로 채워지지 않는 것 같다.

이제 너는 이런 일을 할 것이다.

history.push({
  pathname: '/about',
  search: '?the=search',
  state: { some: 'state' }
})

여기 API 설명서의 링크가 있다.

reactive 라우터 v4의 경우 다음과 같은 방법으로 작업을 수행할 수 있다.

const history = useHistory();
 history.push({
      pathname: "/create-opinion/"+user,
      state:{  username:userName}
    };

그리고 다른 구성 요소에서 간단히 얻을 수 있는 이점:

const history = useHistory();

사용자 이름을 가져오려면:

const username = history.location.state.username;

useHistory를 react-roouter-dom에서 가져오는 것을 잊지 마십시오.

react-reason-dom을 아직 설치하지 않은 경우 다음을 입력하십시오.

$ npm install --save react-router-dom

경로 매개 변수를 전달하려면 다음과 같이 하십시오.나는 샘플 컴포넌트 머천트를 사용하고 있다.

경로 정의

<Route exact path="/merchant/:id" render={(props) => <Merchant id={props.match.params.id}/>} />

기록 정의

const history = createBrowserHistory({
    basename:''
})

매개 변수를 사용하여 기록에 추가

history.push(`/merchant/${id}`)

참조URL: https://stackoverflow.com/questions/38678804/in-react-router-how-do-you-pass-route-parameters-when-using-browser-history-pus