programing

리디렉션 후 구성 요소의 이.props.location에 액세스할 수 없음

prostudy 2022. 3. 12. 10:33
반응형

리디렉션 후 구성 요소의 이.props.location에 액세스할 수 없음

컴포넌트 1의 어딘가에 다음과 같은 것이 있다.

if (redirectToReferrer) {
    return <Redirect to={{
          pathname: "/test/new",
          state: { event: "test" }
     }} />;
}  

내 컴포넌트 2에는 다음과 같은 내용이 있다.

constructor(props){
    super(props);
    console.log(this.props.location) //undefined
}

문서에 따르면, 이것은 효과가 있을 것이다.

상태 개체는 리디렉션된 구성요소에 있는 이.props.location.state를 통해 액세스할 수 있다.이 새로운 레퍼러 키(특별한 이름이 아님)는 '/login' 경로 이름으로 가리키는 로그인 구성 요소의 이.props.location.state.referer를 통해 액세스된다.

왜 그럴까?this.props.location정의되지 않은?

"/테스트/신규"가 에 의해 정의되었는지 확인<Route/>App.js의 구성요소 또는 경로를 정의한 곳.

<Route path="/test/new" component={NewTestComp}/>

렌더 방법을 사용하여 정의한 경우 이렇게 구성요소에 소품을 전달하십시오.

<Route path="/test/new" render={(props) => <NewTestComp {...props}/>}/>

다음과 같이 직접 배선된 기술 구성 요소:

<Route path="/about" component={About} />

위치 등 리액션 라우터에 의해 제공되는 소품을 가지고 있으므로 리디렉션할 때마다 해당 구성요소에 경로가 정의되어 있는지 확인하십시오.

react-router-dom의 최신 버전으로 업그레이드하십시오.현재 버전 5.2.0

참조URL: https://stackoverflow.com/questions/50328786/unable-to-access-this-props-location-in-component-after-redirect

반응형