如何判斷反應路由器v4在哪裏加載組件？

這是讓我困惑的事情反應路由器4.我目前有主要的父組件index.jsx路由設置。導航欄位於它自己的組件NavBar.jsx中。如何判斷反應路由器v4在哪裏加載組件？

我希望它這樣，當你點擊NavBar.jsx一個鏈接，它加載組件到Body.jsx。目前，它在整個屏幕上加載一個組件來替換所有內容。

我相信，隨着陣營路由器3，你應該做的事情與this.props.children的東西，但如果你們和女生可以在此闡明一些對我來說，我會非常感激。謝謝。

這裏是最頂層的組件代碼：

ReactDOM.render(
 
    <Router> 
 
    <div> 
 
     <Route path="/" component={Index} /> 
 
    </div> 
 
    </Router> 
 

 
, document.getElementById('app'));

我的部件從指數走>正文> TabArea 導航欄在索引>旗幟> HotelTop

標籤片區我想要渲染HotelTop的導航欄選擇的組件的位置。

來源

2017-07-07 Milos

粘貼代碼，請。 – garrettmaring

我想通了。在你想要鏈接加載的地方，你必須放置一個交換機，然後在那裏路由，但不要在那裏放置新的路由器。

像...

<div> 
 
    <switch> 
 
    <Route exact path = "/" component={containertoloadpaths}/> 
 
     <Route path = "/Path1" component={component1} 
 
     <Route path = "/Path2" component={component2} 
 
    </Route> 
 
    </switch> 
 
</div> 
 

 
//You can put code like this anywhere in your app where you'd like your links to load, and they'll load there.

來源

2017-07-08 07:04:25 Milos

我相信沒有辦法指定在哪裏渲染路由組件與React路由器4.它總是呈現就地。所以你的組件將永遠是已經呈現它的Route的孩子。

但是你可以在應用程序許多Router設置 - 在Body.jsx例如一個，另一個在一些Sidebar.jsx - 這樣就可以達到你所需要的結果。

來源

2017-07-07 21:03:47

我會嘗試在那裏放置另一臺路由器，看看會發生什麼。 – Milos

如何判斷反應路由器v4在哪裏加載組件？

回答

相關問題