陣營路由器 - 如何做IndexRedirect，重定向與動態路由

Question

以前，我把所有的路由在一個文件中，這樣

render(
    <Provider store={store}> 
     <Router onUpdate={scrollToTop} history={history} > 
      <Route path="/" component={App}> 
       <IndexRedirect to="app/dashboard" /> // IndexRedirect 

       <Route path="404" component={PageErr404} /> 
       <Route path="app" component={MainApp}> 
        <Route path="dashboard" component={Dashboard} /> 
       </Route> 
       <Redirect from="*" to="404" />  // Redirect 
      </Route> 
     </Router> 
    </Provider>, 
    document.getElementById('app-container') 
) 

但現在，我用dynamic routing，並分裂代碼

const rootRoute = { 
    childRoutes: [{ 
     path: '/', 
     component: require('./containers/App'), 
     childRoutes: [ 
      require('./routes/app'), 
      require('./routes/404'), 
     ] 
    }] 
} 

render(
    <Provider store={store}> 
     <Router 
      onUpdate={scrollToTop} 
      history={history} 
      routes={rootRoute} 
     /> 
    </Provider>, 
    document.getElementById('app-container') 
) 

我的問題是，我現在怎麼能IndexRedirect /到/app/dashboard？

此外，像以前一樣將所有其他頁面*重定向到/404？

非常感謝！

Answer 1

您必須使用onEnter事件。
應該是這樣的：

const rootRoute = { 
    path: '/', 
    component: require('./containers/App'), 
    indexRoute: { onEnter: (nextState, replace) => replace('/app/dashboard') }, 
    childRoutes: [ 
     require('./routes/app'), 
     require('./routes/404'), 
    ] 
}