Вложение в IndexRoute

Question

Я написал приложение, чтобы научить себя Flux и React Routers, и я застреваю на вложенных маршрутах. У меня есть список парков, и когда вы нажимаете на один из парков, он выводит страницу показа. Это отлично работает, если у меня есть маршруты, такие как:

const appRouter = (
    <Router history={ hashHistory }> 
    <Route path="/" component={ App }> 
     <IndexRoute component={ AppIndex }/> 
     <Route path="parks/:parkId" component={ ParkShow }/> 
    </Route> 
    </Router> 
) 

Но это не то, что я хочу. Я хочу показать информацию о парке, который нажал на странице AppIndex. Это то, что я должен достичь этой цели:

const appRouter = (
    <Router history={ hashHistory }> 
    <Route path="/" component={ App }> 
     <IndexRoute component={ AppIndex }> 
     <Route path="parks/:parkId" component={ ParkShow }/> 
     </IndexRoute> 
    </Route> 
    </Router> 
) 

я получаю - «Внимание: [реагировать-маршрутизатор] Местоположение„парки/2“не найдено ни одного маршрута»

И - «Внимание: [ реагировать-маршрутизатор] Местоположение «/ парки/2» не найдено ни одного маршрута»

Answer 1

маршрута внутри страницы индекса неправильный путь

const appRouter = (
    <Router history={ hashHistory }> 
    <Route path="/" component={ App }> 
     <IndexRoute component={ AppIndex }/> 
     <Route path="parks/:parkId" component={ ParkShow }/> 
    </Route> 
    </Router> 
) 

Над одним единственно правильный путь Дизайн вашего приложения в такихперемещайте содержимое AppIndex в APP и используйте this.props.children в компоненте APP. Вы должны либо показывать Appindex, либо ParkShow