Nested routes with react router v4 / v5

Question

I am currently struggling with nesting routes using react router v4.

The closest example was the route config in the React-Router v4 Documentation.

I want t

Answer 1

Just wanted to mention react-router v4 changed radically since this question was posted/answed.

There is no component any more! is to make sure only the first match is rendered. well .. redirects to another route. Use or leave out exact to either in- or exclude a partial match.

See the docs. They are great. https://reacttraining.com/react-router/

Here's an example I hope is useable to answer your question.

  

    
     {
      return (
        

          
Home menu
          front
          back
        
      );
    }} />          
     {
      return (
        

        
front menu
        help
        about
        
      );
    }} />
     {
      return 
front help
;
    }} />
     {
      return 
front about
;
    }} />
     {
      return (
        

        
back menu
        help
        about
        
      );
    }} />
     {
      return 
back help
;
    }} />
     {
      return 
back about
;
    }} />
  

Hope it helped, let me know. If this example is not answering your question well enough, tell me and I'll see if I can modify it.