Since react-router routes are components, creating nested routes is as simple as making one route a child of another in JSX. 

 

Make the nested component:

class App extends React.Component {    render(){        return(            
                     
                          
                               
                            
                       
                  
             );    }}

 

Change the path:

const Links = () =>    
     
        
      Home        
      About        
      Contact    
     
;

 

Pass the props.children to the nested component: 

const Home = (props) => 
     
      
Home
      {props.children}
     
;const About = (props) => 
     
      
About
{props.children}
     
;const Contact = () => 
     
      
Contact
     
;

 

----------------

import React from 'react';import {hashHistory, Route, Router, Link} from 'react-router';// About is the child of home, to display the about, we need to access// props.childrenconst Home = (props) => 
     
      
Home
      {props.children}
     
;const About = (props) => 
     
      
About
{props.children}
     
;const Contact = () => 
     
      
Contact
     
;const Links = () =>    
     
        
      Home        
      About        
      Contact    
     
;class App extends React.Component {    render(){        return(            
                     
                          
                               
                            
                       
                  
             );    }}export default App;