리액트 라우터의 기본 url(/)이 렌더링 되지 않게 하는 간단한 방법

<Route path="/admin" component={Admin} />

<Route path="/" component={Home} />

 

리액트 라우터는 path의 url에 해당하는 컴포넌트를 렌더링 해준다.

그러나 시작하는 부분만 일치하더라도 렌더링해주는 방식이기 때문에

위의 경우 "/admin" url로 접근해도 <Admin />만 렌더링 되는게 아닌

<Home />도 같이 렌더링이 된다.

 

때문에 보통 <Switch />라는 모듈을 함께 써서 라우팅을 해주지만

간단하게 url이 정확히 일치할 때만 렌더링 되게 하려면 속성에 exact를 넣어준다.

 

<Route path="/" exact component={Home} />

 

이제 <Home />은 url이 "/" 일 때만 렌더링이 된다.