如何使用react-router從URL解耦用戶界面？

Question

以下是我想要配置嵌套路線反應路由器：

<Route path="/" component={App}> 
    <Route path="student/:studentId" onEnter={checkAuth} component={Student}> 
     <Route path="edit" onEnter={checkAuth} component={StudentForm} /> 
    </Route> 
</Route> 

的student/:studentId網址應顯示的特定studentId所有細節。

嵌套的student/:studentId/edit應顯示一個窗體來編輯以前顯示的值。

我想避免的是必須將StudentForm組件嵌套在Student組件內，並直接在App的內部顯示錶格。

我一直在閱讀react-router回購的所有文檔，尤其是這一個：Decoupling the UI from the URL，但它解釋完全相反（如何讓組件嵌套在另一個組件中，但可通過不同的url訪問）。

我可以檢查url是否爲edit並呈現表單而不是學生列表，但我希望避免條件呈現。

有沒有人知道使用react-router實現這一目標的方法？

Answer 1

顯然，解決方案是在路由器配置不嵌套的路線一樣簡單：

<Route path="/" component={App}> 
    <Route path="student/:studentId" onEnter={checkAuth} component={Student}> 
    <Route path="student/:studentId/edit" onEnter={checkAuth} component={StudentForm} /> 
</Route> 

這樣的配置不會窩組件。