react-router v4 - MatchWhenAuthorized 예

Question

여기의 예에서 - https://react-router.now.sh/auth-workflow - 로그인 한 후에도 (주소 표시 줄이나 비슷한 주소에 주소를 입력하여) 로그인 경로가 여전히 일치합니다.

MatchWithAuthTestBefore와 같은 항목을 만드는 것 외에는이 문제에 대한 좀 더 우아한 해결책이 있습니까? 한 세트의 구성 요소는 렌더링 할 수 있습니다. 하나는 권한있는 경우이고 다른 하나는 그렇지 않은 경우입니다.

Answer 1

RRv4는 모두 구성 요소에 대한 것이므로 솔루션은 구성 요소에서이를 처리해야합니다. 기본적으로 리디렉션 곳의 예에 나와있는 <MatchWhenAuthorized> 구성 요소의 반대는 사용자가 로그인합니다.

const MatchWhenUnauthorized = ({ component: Component, ...rest }) => (
    <Match {...rest} render={props => (
    !fakeAuth.isAuthenticated ? (
     <Component {...props}/> 
    ) : (
     <Redirect to={{ pathname: '/' }}/> 
    ) 
)}/> 
) 

이것은 정상적인 라우팅/뷰 구성 (경기 /login와 함께 할 것입니다 무엇을하고 login을 유사 사용자가 이미 인증 된 경우 리디렉션하는보기).