title: Add prefix to routes in React Router v4
body: <p>I want to create a prefix for some paths in React Router v4, such as <code>v1</code> in front of all my routes for version 1 of my app. Here's what I've tried:</p>
  
  <pre><code>&lt;BrowserRouter&gt;
    &lt;Switch&gt;
      &lt;App path="v1" &gt;
        &lt;Switch&gt;
          &lt;Route path="login" component={Login} /&gt;
          &lt;Route component={NotFound} /&gt;
        &lt;/Switch&gt;
      &lt;/App&gt;
      &lt;Route component={NotFound}/&gt;
    &lt;/Switch&gt;
  &lt;/BrowserRouter&gt;
  </code></pre>
  
  <p>Here's <code>App</code>:</p>
  
  <pre><code>import React, { Component } from 'react';
  import logo from '../Assets/logo.svg';
  import '../Assets/css/App.css';
  
  class App extends Component {
    render() {
       return (
         &lt;div&gt;
           {this.props.children}
         &lt;/div&gt;
       );
    }
  }
  
  export default App;
  </code></pre>
  
  <p>Currently I am using this approach but it doesn't seem to working.
  When I go to <code>http:\\localhost:3000\v1\login</code> it shows the <code>NotFound</code> component.
  Any help here?</p>