0

How does the two path differ . I tried going through the docs of react router but it still creates confusion . First one is

   <Route
    path="/cricket/:description/:id"
    component={xyz}
  />
 and another is 
  <Route 
   exact
   path="/cricket"
   component={xyz1}
 />

I see that the first Route is mentioned in App.js .It leads to confusion as which one got executed and how ?

  • The first path has actual [URL parameters](https://reacttraining.com/react-router/web/example/url-params) which you can access later – Keno Clayton Mar 11 '19 at 11:05
  • First is a route which contains parameters. So for example this routes to `mydomain.com/cricket/points/3`. These parameters can be used in the component. Second route is just to `mydomain.com/cricket` – DTul Mar 11 '19 at 11:06
  • Here's a nice thread https://stackoverflow.com/questions/49162311/react-difference-between-route-exact-path-and-route-path – t3__rry Mar 11 '19 at 11:06

1 Answers1

0

Router will render both componenets if path is something like /cricket/foo/123 because it matches both pattern.

If you want only one to render you have to use exact prop like

<Route exact path="/cricket" component={xyz1} />

Amit
  • 2,492
  • 2
  • 21
  • 31