Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Match multiple path with react router v4

Given I have 2 path rendering the same component, how do I avoid to repeat route configs like this :

<Route path="/path1" component={MyComp} />
<Route path="/path2" component={MyComp} />
like image 749
sylvain Avatar asked Apr 21 '17 13:04

sylvain


People also ask

How use multiple routes in react?

Nested Routes Nesting Routes in React Router is pretty simple. All you need to do is create a new component to store your nested Routes this component should have a Routes component and inside that Routes component should be all the Route components that you are matching with the parent Route .

Can we have multiple routes in react?

EDITED: Multiple routed with multiple layouts can be done by using <Outlet> component in layouts and <Route> component composition.

How can I ensure a route matches only if the complete path matches?

If the intention is to strictly match only /items , the <Route/> component accepts an exact prop. Adding this ensures that only the pathname that exactly matches the current location is rendered. Below is an example that uses the exact prop.


1 Answers

Best solution I found so far (but seems a bit strange) :

<Route path="/:path(path1|path2)" component={MyComp} />
like image 155
sylvain Avatar answered Sep 19 '22 22:09

sylvain