2017-05-23 4 views
3

다음은 내가 달성하려고하는 것입니다 : 사용자가 내 ReactJS 사이트에서 보호 된 페이지에 액세스하려고하면 플래시 메시지가 표시된 홈 페이지로 리디렉션하고 싶습니다. "제발 로그인"또는 이와 유사한. 어떻게하면 반응 라우터 v4에서이를 달성 할 수 있습니까? 여기에 지금까지이 작업은 다음과 같습니다플래시 메시지 반응 라우터 4 리디렉션하는 방법

<Router> 
<div> 
    <Switch> 
    <Route path="/" component={Home} /> 
    <Route 
     exact path="/source" render={() => (
     isAuthenticated() ? (
      <Source /> 
     ) : (
      <Home /> //I want to Redirect to the Home Page with a flash message if user is not logged in 
     ) 
    )} 
    /> 
    <Route path="/contact" component={ContactUs} /> 
    </Switch> 
</div> 
</Router>, 
); 

답변

1

다음은 저에게 도움이되었습니다. react-router v4와 함께 제공되는 Redirect 메소드를 사용했습니다. 그것은 당신이 이것을 쉽게 달성 할 수있게 해줍니다.

<Route 
     exact path="/source" render={() => (
     isAuthenticated() ? (
      <Source /> 
     ) : (
      <Redirect 
      to={{ 
       pathname: '/', 
       state: 'Please sign in' 
      }} 
      /> 
     ) 
    )} 
    /> 

현재 리디렉션에 대한 자세한 내용을보실 수 있습니다 : React Router v4 - Redirect

1

방법이 <Home> 구성 요소에 속성에 로그인 보내고 다음 홈 구성 요소가 해당 속성을보고 필요한 경우 플래시 메시지를 렌더링 할 수있는 약 :

exact path="/source" render={() => (
    isAuthenticated() ? (
     <Source /> 
    ) : (
     <Home loggedIn={isAuthenticated} /> 
    ) 
)} 
+0

감사 토드. 나는이 경우 나에게 효과가 있었던 질문에 대답했다. –