Question: I want from `path="/users/:login/:repo"` to view login's repo detail page but it doesn't work and views UserProfile component.
Here is the click:

```
 <Link to={this.props.location.pathname+'/'+item.name}>
   <div>
      <h4>{item.name}</h4>
      <p>{item.description} </p>
   </div>
 </Link>

<Switch>
    <Route exact path="/" component={Contributors}/>
    <Route  path="/users/:login" component={UserProfile}/>
    <Route  path="/users/:login/:repo" component={RepoPage}/>
</Switch>

```

Answer: 
You need to reverse the ordering of your routes, since `Switch` matches the first route

```
<Switch>
    <Route exact path="/" component={Contributors}/>
    <Route  path="/users/:login/:repo" component={RepoPage}/>
    <Route  path="/users/:login" component={UserProfile}/>
</Switch>

```

With React-router the paths that are prefixes to the exactly matching path are also matched and hence `"/users/:login/:repo"` also matches `"/users/:login"`, and since you are using switch, RepoPage is getting rendered and not other Routes defined after this are getting checked.
Any url matched by `"/users/:login/:repo"` will be matched by `"/users/:login"` as well, unless you use `exact` qualifier. 

In the context of `Switch` it means that `UserProfile` will be rendered every time because it comes first.

Solution would be to change:

```
<Route  path="/users/:login" component={UserProfile}/>

```

to 

```
<Route exact path="/users/:login" component={UserProfile}/>

```