2017-03-15 4 views
0

React 앱의 경로를 설정 중입니다. 내 홈페이지를 입력 할 때 Auth0의 일부 데이터를 기록하고 싶습니다. 이렇게하려면 단순히 사용자 onEnter 특성 일 뿐이지 만 작동하지 않는 것 같습니다.React-router onEnter가 트리거되지 않습니다.

import React from 'react' 
import {Route, IndexRedirect} from 'react-router' 
import AuthService from 'utils/AuthService' 
import Container from './Container' 
import Home from './Home/Home' 
import Login from './Login/Login' 

[...] 

const requireAuth = (nextState, replace) => { 
    if (!auth.loggedIn()) { 
    replace({ pathname: '/login' }) 
    } 
} 

const parseAuthHash = (nextState, replace) => { 
    console.log('LOG SOMETHING YOU IDIOT'); 
    if (/access_token|id_token|error/.test(nextState.location.hash)) { 
    auth.parseHash(nextState.location.hash) 
    } 
} 

export const makeMainRoutes =() => { 
    return (
    <Route path="/" component={Container} auth={auth}> 
     <IndexRedirect to="/home" /> 
     <Route path="home" component={Home} onEnter={requireAuth} /> 
     <Route path="login" component={Login} onEnter={parseAuthHash} /> 
    </Route> 
) 
} 

export default makeMainRoutes 

어떤 이유로 로그인 할 때 콘솔에 아무것도 표시되지 않습니다. 나는 너무 조심스럽게 노력했다. 내가 뭐 놓친 거 없니 ?

+0

플러스 하나 https://reacttraining.com/react-router/web/example/auth-workflow

다음은 주요 그것의 생각 : 새로운 문서는이의 예를 가지고 –

답변

1

난 당신이 onEnter 페지했다 V4를 사용하고 추측하고있어 : https://reacttraining.com/react-router/web/api/Route

는 대신, 렌더링 소품을 사용한다. 로깅 메시지에 대한

const PrivateRoute = ({ component, ...rest }) => (
    <Route {...rest} render={props => (
    fakeAuth.isAuthenticated ? (
     React.createElement(component, props) 
    ) : (
     <Redirect to={{ 
     pathname: '/login', 
     state: { from: props.location } 
     }}/> 
    ) 
)}/> 
) 
관련 문제