陣營路由器 - 指定無關路線

Question

我在3頁有以下途徑作出反應應用沿父組件：

1. 登錄（/）
2. 儀表盤（/儀表板）
3. 項目（/項目）

我想儀表板和項目頁面有一個標題，但登錄頁面不應該有任何標題。

目前的路線是這樣的：

<Router> 
    <Route path="/" component={Login}> 
    <Route path="/dashboard" component={Dashboard} /> 
    <Route path="/projects" component={Projects} /> 
</Router> 

我創建了一個名爲Shell組件，它只是頭。如何設置我的路由器，以便Shell是Dashboard和Projects的父組件，但不是Login頁面？

編輯1

我想知道是否可以使用無路父母這樣呈現殼牌周圍的子組件：

<Router> 
    <Route path="/" component={Login}> 
    <Route component={Shell}> 
     <Route path="/dashboard" component={Dashboard} /> 
     <Route path="/projects" component={Projects} /> 
    </Route> 
</Router> 

編輯2

只是嘗試了上面的改變，它的工作原理！閱讀文檔path不是必需的道具。所以在上面的代碼<Route component={Shell}>是完全合法的。

Answer 1

你在編輯1中有什麼是正確的。

<Router> 
    <Route component={Login}> 
    <Route component={Shell}> 
    <Route path="/dashboard" component={Dashboard} /> 
    <Route path="/projects" component={Projects} /> 
    </Route> 
</Router> 

而在你<Shell>組件，你可以這樣做：

import Header from './Header'; 

... 

render() { 
    return (
    <div id="shell"> 
     <Header /> 
     {this.props.children} 
    </div> 
); 
} 
...