爲什麼我不通過交換機進行路由？ React Router v4

我正在使用React Router 4，並沒有通過嵌套的Switch組件進行路由。這裏是我的路線：爲什麼我不通過交換機進行路由？ React Router v4

const routes = (
    <div> 
    <Switch> 
     <Route exact path="/" > 
     <Switch> 
      <Route path="/test" component={Test} /> 
      <Route path="/other" component={Other} /> 
      <Route path="/about" component={About} /> 
     </Switch> 
     </Route> 
     <Route path="*" component={NotFound} /> 
    </Switch> 
    </div> 
);

我打根/路線，但如果我嘗試路由到其他任何嵌套路線，/other，/test的，我去我的錯誤頁面。我認爲這是因爲我有exact的Route與根/路線，但我不知道。我該如何解決？

來源

2017-08-17 jhamm

由於文件說，

開關呈現的第一個孩子或該位置相匹配。

在你的情況下，外部交換機2之間選擇，精確的路徑=「/」和* ...所以它會與NOTFOUND總是匹配除非路徑正是「/」這就是爲什麼你應從第4行刪除確切內容，並在內部開關內移動<Route path="*" component={NotFound} />。

對於你的情況我會寫這樣的： https://github.com/sstawecki/polakete/blob/master/client/src/index.js https://github.com/sstawecki/polakete/blob/master/client/src/Routes.js

來源

2017-08-17 14:34:54 Polak

第一'之開關總是要路線：

const routes = ( <Switch> <Route exact={true} path="/" component={Index} /> <Route exact={true} path="/test" component={Test} /> <Route exact={true} path="/other" component={Other} /> <Route exact={true} path="/about" component={About} /> <Route path="*" component={NotFound} /> </Switch> );

你可以從我的工作示例檢查這些文件第一個「路線」。路由器永遠不會路由到'NotFound'' Route'。 – jhamm

你是對的，我已經更新了答案，結構取決於將如何成爲你的頁面佈局，我分享了我的例子，因爲我的頁眉和頁腳處於分離的路徑，並且交換機中的所有路由都在另一個路由中組件，包括NotFound路由。現在不需要嵌套開關。 – Polak

我需要多個'Switch'。基本上，如果你有權訪問，你將被允許進入第一個'Switch'的第一個'Route'，否則你將進入'Not Found'頁面。如果你通過第一個'Switch'完成，那麼你將被允許瀏覽第二個'Switch'。 – jhamm

爲什麼我不通過交換機進行路由？ React Router v4

回答

相關問題