react router v4 다른 구성 요소에서 발생하는 이벤트를 다시 불러오지 않으려면

4009 단어 react-routerReact
일반적으로 사용자는 압력<Link>에 따라 각각 <Route>에 분배된 구성 요소를 표시하지만, 구성 요소의 생성 이벤트와 연결되어 <Route>에 분배된 구성 요소를 프로그램적으로 변환할 때<Link>

방법1 - 포위


사건이 발생한 구성 요소를 <Link>로 포위
<link to="/path">
  <SomeComponent onTouchTap={() => console.log("event!")}>
</link>
이렇게 되면 활동 내용에 따라 링크 여부를 판단할 수 없다

방법2-push

handler(){
  //...何らかの処理
  //...
  if(ok){
    this.props.history.push("/path")
  }
}
//...
//...
<SomeComponent onTouchTap={() => this.handler}>
이렇게 되면 서버/path가 대히트(결과적으로 재부팅)

방법3(해결 방법)

handler(){
  //...何らかの処理
  //...
  if(ok){
    const location = {
      pathname: "/path",
      state: { fromDashboard: true }
    }
    this.props.history.push(location)
  }
}
//...
//...
<SomeComponent onTouchTap={() => this.handler}>
location 대상에 대해push 진행
이렇게 하면 클릭<Link>한 것처럼 서버에 연결되지 않고 화면 이동은 프로그램에 따라 할 수 있다

좋은 웹페이지 즐겨찾기