title: react router nested components issue
body: <p>I have the following code - </p>
  
  <pre><code>class App extends Component {
      render() {
          return (
              &lt;Router&gt;
                  &lt;Switch&gt;
                          &lt;MainPage&gt;
                              &lt;Route exact path="user" component={Error}/&gt;
                          &lt;/MainPage&gt;
                  &lt;/Switch&gt;
              &lt;/Router&gt;
          )
      }
  }
  </code></pre>
  
  <p>Right now MainPage is rendered for every Url , which i understand why,
  but lets say that i want it to be render just for certain pages.
  how can i wrap it in order to get it done?</p>