0

I have a component with below routes

<Route key= 'project-data' path='project/:id/detail/project-data/' render={ProjectDataView}>
<Route key= 'task' path='project/:id/detail/project-task/' render={renderForm2}>
<Route key= 'activity' path='project/:id/detail/project-activity/' render={renderForm3}>
<Route key= 'milestone' path='project/:id/detail/project-milestone/' render={renderForm4}>
<Route key= 'project' path='project/:id/detail/project-data/update/' render={UpdateProjectView}>

There is one button in ProjectDataView to project/:id/detail/project-data/update/ which should go to UpdateProjectView, however, it does not work.

The weird thing is if I change the last Route's path to project/:id/detail/project-update/ and the button to destination to project/:id/detail/project-update/, then it's all good. As I only change the path so I am guessing it's something Route does which I do not know.

I am new to react-route. I am using react-route 4.

halfer
  • 18,701
  • 13
  • 79
  • 158
Keannylen
  • 143
  • 2
  • 11
  • Your first and last route are same. So it always picks up first route. Use exact for last route. Ref - https://stackoverflow.com/questions/49162311/react-difference-between-route-exact-path-and-route-path – tarzen chugh Mar 30 '19 at 11:58
  • @tarzenchugh thanks and the link you provided explains details – Keannylen Mar 30 '19 at 12:12
  • wrap in a Switch, using exact as the previous one and move the last to above the first then your problem will be solved – duc mai Mar 30 '19 at 22:53

0 Answers0