andy mccullough
andy mccullough

Reputation: 9571

react-router-redux - how to do nested routing

How do you get nested routing with react-router-redux (5.0.0-alpha.9)?

I want to be able to route to the likes of /event/create I am able to successfully get to a route of /event/:id, e.g. /event/1234

I have -

<Route exact path="/" component={HomePage} />
<Route path="/event/:id" component={EventView} />
<Route path="/event/create" component={EventCreate} />

It looks as though when I go to /event/create is routing to /event/:id

Upvotes: 0

Views: 739

Answers (1)

Nick
Nick

Reputation: 4092

The Router will return on the first match. In your case, you simply need to move the last two statements as :id will match on anything:

<Route exact path="/" component={HomePage} />
<Route path="/event/create" component={EventCreate} />
<Route path="/event/:id" component={EventView} />

This will match on /event/create first and if there's any other value, it will match on the subsequent route.

Upvotes: 3

Related Questions