如何從沒有結尾的斜線路由到子目錄？

Question

我使用的反應路由器V4

假設我在以下位置

http://localhost:3000/articles 

我想這個位置有一個反應的路由器鏈接元素，它指向

http://localhost:3000/articles/new 

第一次嘗試：

<Link to="new" /> 

個

點

http://localhost:3000/new 

第二次嘗試：

<Link to="/new" /> 

從任何位置點

http://localhost:3000/new 

第三次嘗試：

<Link to="new" /> 

從

http://localhost:3000/articles/ /* notice the slash at the end */ 

點

在

http://localhost:3000/articles/new 

成功，但我需要它的工作範圍：

http://localhost:3000/articles 

Answer 1

您應該指向的Link到/articles/new

<Link to="/articles/new" />

您路由器應該與此類似：

const App =() => (
    <Router> 
    <div className="wrapper"> 
     <Route path="/" exact component={Home} /> 
     <Route path="/articles" component={Articles} /> 
     <Route path="/articles/new" component={New} /> 
    </div> 
    </Router> 
); 

注：配置你的路由器作爲例子將呈現兩種成分（文章和新建）。如果您只想修改New，則應該將屬性exact添加到父組件。

<Route path="/articles" exact component={Articles} />