如何使用React Router獲取兩個組件的XOR路由？

我的應用 - 成分，它看起來是這樣的：如何使用React Router獲取兩個組件的XOR路由？

class App extends Component { 
    render() { 
     return (
      <div> 
       <Route path='/:category?/:post?' component={Posts}/> 
       <Route exact path='/edit' component={PostForm}/> 
      </div> 
     ) 
    } 
}

現在的問題是，我想有異或行爲，即在第一部分呈現，我不希望第二個是渲染，反之亦然。我實際上得到的是，像localhost3000/books/123344這樣的URL只顯示第一個組件，但使用localhost3000/create這個URL，這兩個組件都被渲染。

這是什麼原因以及如何獲得所需的兩個組件的XOR渲染？

來源

2017-10-14 user1934212

使用react-router switch，它只會渲染一個組件。還要切換路線的順序。

試試這個：

<Switch> 
    <Route exact path='/edit' component={PostForm}/> 
    <Route path='/:category?/:post?' component={Posts}/> 
</Switch>

來源

2017-10-14 09:05:01

你帶來了兩個有趣的新概念。標籤中的訂單是否也有問題？ – user1934212

不是所有的路徑路徑都有不同的值，但在你的情況下你使用的是路由參數（不是固定值），所以如果你首先定義'/：category'路徑，那麼它將匹配所有的路徑和相同的路徑組件將始終呈現。 –

如何使用React Router獲取兩個組件的XOR路由？

回答

相關問題