2017-01-07 2 views
1

Я создаю одно приложение, которое имеет 2 компонента для одного пути. Вот мои маршруты:Реактивный маршрутизатор с несколькими компонентами onEnter в случае auth?

<Router history={hashHistory}> 
    <Route path="/" component={AppContainer} onEnter={requireEnter}> 
     <Route path="/homepage" component={HomePage} /> 
     <Route component={MainPage} onEnter={requireAuth}> 
      <Route path="/home" component={DashBoard} /> 
     </Route> 
    </Route> 
</Router> 

В этом случае я вхожу в мое приложение с помощью AppContainer компонента. Вместо этого я хочу, чтобы этот компонент был по моему выбору, потому что у меня есть домашняя страница, которая будет иметь path="/".

Сейчас onEnter={requireEnter} обрабатывает в следующих случаях:

function requireEnter (nextState, replace) { 
    if (nextState.location.pathname == "/") { 
     if (checkLoggedIn()) { 
      replace({ 
       pathname: '/home' 
      }) 
     } else { 
      replace({ 
       pathname: '/homepage' 
      }) 
     } 
    } 
} 

Но я хочу что-то вроде этого:

function requireEnter (nextState, replace) { 
    if (nextState.location.pathname == "/") { 
     if (checkLoggedIn()) { 
      //component should be AppContainer and redirect to '/home' 
     } else { 
      //component should be home page 
     } 
    } 
} 

ответ

0

Вы можете добавить маршрут, без компонента в нем, использовал его в другой подобный случай:

<Route path="/" onEnter={requireEnter}> 
    <Route path="home" component={AppContainer}> 
     <IndexRoute component={HomeContainer} /> 
    </Route> 
    <Route path="homepage" component{HomePageContainer}> 
    </Route> 
</Route> 

Тогда как обычно:

function requireEnter (nextState, replace){ 
    if(nextState.location.pathname=="/"){ 
     if(checkLoggedIn()){ 
     replace({ 
       pathname: '/home' 
      }); 
     }else{ 
     replace({ 
       pathname: '/homepage' 
     }); 
     } 
    } 
} 
Смежные вопросы