nested Router

nested Router는 웹페이지를 이동하지 않고 즉각적으로 url을 통해 내용을 보여주는 것이다.

 

<Link to={`/${coinId}/chart`}>Chart</Link>
<Link to={`/${coinId}/price`}>Price</Link>

<Switch>
    <Route path={`/${coinId}/price`}>
        <Price />
    </Route>
    <Route path={`/${coinId}/chart`}>
        <Chart />
    </Route>
</Switch>

<Link>를 누르게 되면 해당 url을 수용하여 Route가 해당하는 내용을 보여주게 된다. 

Chart를 누르면 바로 아래에 Chart를, Price를 누르면 Price의 내용을 보여준다. 

 

보편적으로 알고 있는 탭(Tab)의 기능을 하는 것이다.