title: Adding a class base on the route in react router
body: <p>I've the following code base.</p>
  
  <pre><code>&lt;Router&gt;
      &lt;Grid className='full-height' fluid&gt;
          &lt;Row&gt;
              &lt;Col xs={6} xsOffset={6} className='top-line' /&gt;
          &lt;/Row&gt;
          &lt;Row&gt;
              &lt;NavBar /&gt;
          &lt;/Row&gt;
          &lt;Row&gt;
              &lt;div className='content-wrapper'&gt;
                  &lt;Switch&gt;
                      &lt;Route exact path='/' component={Container} /&gt;
                      &lt;Route path='/login' component={Login} /&gt;
                      &lt;Route path='/register' component={Register} /&gt;
                      &lt;Route path='/dashboard' component={Dashboard} /&gt;
                      &lt;Route exact path='/packages' component={Packages} /&gt;
                      &lt;Route path='*' component={NotFound} /&gt;
                  &lt;/Switch&gt;
              &lt;/div&gt;
          &lt;/Row&gt;
      &lt;/Grid&gt;
  &lt;/Router&gt;
  </code></pre>
  
  <p>I would like to add a class to the <code>Grid</code> component based on the route path. Basically what I want is to add a specific class when on <code>path='/'</code> so I can custom style home page. Since the <code>container</code> component is residing inside the <code>content-wrapper</code> I couldn't style it to the way I want. </p>
  
  <p>How can I add a custom class based on the route path in react router?</p>