IndexRouteのネスト

Question

FluxとReact Routersを教えるためのアプリを書いたので、ネストされたルートにはまってしまいます。私は公園のリストを持っています。公園の1つをクリックすると、ショーページが表示されます。これは、次のようにネストされたルートを持っているとうまくいきます。

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

しかし、それは私が望むものではありません。 AppIndexページでクリックした公園に関する情報を表示したいと思います。 「：[反応-ルータを表示]ロケーション警告 『公園/ 2』任意のルートと一致しませんでした」

そして - - 「警告：私が得る

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

：これは私がその目標を達成するために持っているものです[反応-ルータ]ロケーション「/公園/ 2」インデックスページが間違った道1以上

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

なるようにアプリケーションを設計し 唯一の正しい方法があるの内側にどんなルート」

Answer 1

ルートと一致しませんでしたa AppIndexの内容をAPPに移動し、APPコンポーネントでthis.props.childrenを使用します。 AppIndexまたはParkShowを表示する必要があります