반응 라우터 루트 onChange 무한대를 바꾸려면

Question

루트 onEnter 또는 onChange 후크에서 경로를 변경하면 URL이 무한대로 변경됩니다. 그러나 자식 경로에서 경로를 변경하면 작동합니다. 사실 저는 한 곳에서 인증을 처리하려고합니다. 그렇지 않으면 모든 하위 경로가 동일한 논리를 처리해야합니다.

{ 
    path: '/', 
    onChange: function(prevState, nextState, replace, callback) { 
     if(!logined) { 
      replace('login'); 
     } 
    }, 
    childRoutes: [ 
     .... 
    ] 
} 

Answer 1

onChange이

도

onChange: function(prevState, {location:{pathname:next}}, replace)=> { 
     if(!logined && next !== '/login') { 
      replace('/login'); 
     } 
} 

한 곳에서 인증을 처리하기 위해, 당신은 HOC, 그

const CheckAuth = (isLogined, redirectPath) => Component => 
class CheckAuth extends React.Component { 
    componentWillUpdate(nextProps, nextState){ 
     //Check auth on change 
     this.checkAuth(nextProps); 
    } 
    componentWillMount(){ 
     //Check auth on enter 
     this.checkAuth(this.props); 
    } 
    checkAuth({location}){ 
     if(!isLogined && location.pathname!==redirectPath) { 
      browserHistory.replace(redirectPath); 
     } 
    } 
    render(){ 
     return (<Component {...this.props}/>); 
    } 
}; 

같은 것을 사용하려고 replace

에 호출 때문에 무한히 변경

및 앱 구성 요소

class App extends React.Component { ... } 
export default CheckAuth(isLogined,'/login')(App); 

또한, redux-auth-wrapper

있는 방법이