React Router Dom routes and sub-routes

React-router-dom / ReactJS beginner in general here.

I’ve got some working router code that I think can be slightly cleaned up, but attempts at doing so have failed thus far. There are certainly some gaps in my knowledge in this area. I’ve paged through the similar questions which has helped me expand my understanding, but I haven’t successfully connected the dots at this point.

The following code seems to work fine, but I am irked by the repeated “/admin” prefix for all the admin routes.

  • Home
  • Content
  • ...

However, moving the “nested” routes to sub-route elements doesn’t work. The JavaScript console spits out the error message “Warning: You should not use and in the same route; will be ignored.”


Any suggestions would be greatly appreciated. I’ve read through a number of SO answers, and found some options in which, for example, I could use (...)}/>, but at this time it doesn’t seem like the right path to go down.

The reason for this being, I will ultimately need route parameters further down the tree, e.g. for a URI along the lines of /admin/content/:content_type/:identifier, and ideally my AdminContent component would be agnostic about its parent route match.

Please feel free also to let me know if I’m way off base, and if there is any documentation you believe would show me the light I would love to read it.

Cheers and thanks again!

Powered by Zordis

Share This Post
Have your say!

Leave a Reply