title: React Router v4 and nested routes: index navlink always remain active
body: <p>Currently i have this routing structure:</p>
  
  <p>//Main.js: </p>
  
  <pre><code> &lt;Router&gt;
      &lt;Switch&gt;
          &lt;Route exact path='/' component={AuthApp}/&gt;
          &lt;Route path='/app' component={ContentApp}/&gt;
      &lt;/Switch&gt;
  &lt;/Router&gt;
  </code></pre>
  
  <p>I need some inner navigation inside of my ContentApp:</p>
  
  <pre><code>//ContentApp:
  &lt;Route exact path={`${match.url}/`} component={Content}/&gt;
  &lt;Route exact path={`${match.url}/something`} component={Something}/&gt;
  &lt;Route exact path={`${match.url}/else`} component={Else}/&gt;
  &lt;Route exact path={`${match.url}/blahblah`} component={BlahBlah}/&gt;
  </code></pre>
  
  <p>And some navigation ofc:</p>
  
  <pre><code>//Header.js
  &lt;NavLink exact to='/app' &gt;Dashboard&lt;/NavLink&gt;
  &lt;NavLink to='/app/something' &gt;Something&lt;/NavLink&gt;
  &lt;NavLink to='/app/else' &gt;Else&lt;/NavLink&gt;
  &lt;NavLink to='/app/blahblah' &gt;BlahBlah&lt;/NavLink&gt;
  </code></pre>
  
  <p>So the thing is: its working just fine, however the first link always remains active. Can anyone suggest how can i solve this problem? Thanks</p>