Nested routes with react router v4 not working - reactjs

Question

I have create a route for a page.In side that page I have use 4 component.I have give path to these to these component.In header dropdown I have given links to these components, On first click the path is change.
but in second click the url is change but not redirecting.
const menu = (
<Dropmenu>
<Menu
key="menu"
style={{ backgroundColor: '#0f2037', borderRadius: '0' }}
>
<Menu.Item key="golive">
<Link to={'/s/live'} style={{ color: '#fff' }}>
<Icon type="video-camera" />
Start Live Broadcast
</Link>
</Menu.Item>
<Menu.Item key="mychannel" style={{ color: '#fff' }}>
<Link to={'/s/profile'} style={{ color: '#fff' }}>
<Icon type="user" />
Manage Profile
</Link>
</Menu.Item>
<Menu.Item key="settings">
<Link to={'/s/account'} style={{ color: '#fff' }}>
<Icon type="setting" />
Account
</Link>
</Menu.Item>
<Menu.Item
key="logout"
onClick={this.logoutCall}
style={{ color: '#fff' }}
>
<Icon type="logout" />
Logout
</Menu.Item>
</Menu>
</Dropmenu>
);
<BrowserRouter>
<Switch>
<Route path="/s" component={GoLive} />
<Route
path="/s/profile"
render={() => (
<div>
<ManageProfile descri={teprop} />
</div>
)}
/>
</Switch>
</BrowserRouter>

Answer 1

Adding exact to Routes will solve the problem:
<Route path="/s" exact={true} component={GoLive} />
<Route
exact={true}
path="/s/profile"
render={() => (
<div>
<ManageProfile descri={teprop} />
</div>
)}
/>
The Switch component renders the first matching route and /s is matched in /s/profile/ .

Answer 2

You can use exact in Route:
<Route exact path="/one" component={About}/>
https://reacttraining.com/react-router/web/api/Route/exact-bool