With React Router v4 the entire library is built as a series of React components. That means that creating nested Routes is as simple as creating any other nested element in your application.
Parent route:
<NavLink to="/menu">Menu</NavLink> <Route path="/menu" component={Menu}></Route>
Child route:
import React from 'react'; import {Link, Route} from 'react-router-dom'; const Menu = () => ( <div> <h1>Menu</h1> <Link to="/menu/food" >Food</Link> <Link to="/menu/drinks">Drinks</Link> <Link to="/menu/slides">Slides</Link> <Route path="/menu/:section" render={({match}) => { return <h3>Section: {match.params.section}</h3> }}> </Route> </div> ); export default Menu;