React Router v4 구성 요소가로드되지 않음 버튼 제출

Question

로그인 폼이 있는데 로그인을 클릭하면 URL이 업데이트되지만 구성 요소는 업데이트되지 않습니다. (예를 들어, 로컬 호스트 : 8080/어딘가에 여전히 로그인 페이지) 내 패키지의

버전은 다음과 같다 :

• 는 반응 - 15.4.2
• 반응 라우터 & 반응 라우터-DOM을 - 4.1.1
• REDUX - 형태 - 6.6.1

이 로그인 구성 요소

,762,384입니다

공유 기록 개체가 있기 때문에 history.push을 사용하고 있습니다.

<Provider store={ store }> 
     <Router history={history}> 
     <App> 
      <Switch> 
      <Route exact path="/" component={ Home }/> 
      <Route path="/login" component={ Login } /> 
      <Route path="/somewhere" component={ Somewhere } /> 
      </Switch> 
     </ App > 
     </Router> 
    </Provider> 

내가 <Redirect>를 사용하여 시도하지만이 동작하지 않습니다 다음과 같이

내 노선이다. 또한 withRouter을 사용해 보았지만 경로에 선언되지 않은 구성 요소에만 해당된다는 것을 알았습니다.

양식을 제출할 때 어딘가의 구성 요소로 어떻게 리디렉션합니까?

Answer 1

나는이 이렇게하는 가장 좋은 방법은 있는지 모르겠지만, 나를 위해 작동합니다

<form onSubmit={ this.props.handleSubmit(this.handleFormSubmit) }> 
    <Field name="email" type="text" label="Email"/> 
    <Field name="password" type="password" label="Password"/> 
    <button action="submit">Sign In</button> 
    {this.props.user.loggedIn && <Redirect to={'/Somewhere'} />} 
</form> 

this.props.handleSubmit(this.handleFormSubmit)이 user의 참 loggedIn 소품으로 전환하는 작업을 전달한다는 사실을 감안할 때.

user.loggedIn이 변경되면 구성 요소가 다시 렌더링되도록 user을 props에 매핑해야합니다. 그러면 <Redirect>이 활성화됩니다.