react-router-dom의 살펴보기

이정민·2023년 5월 30일
0

outlet이란?

자식 경로 요소를 렌더링하려면 부모 경로 요소에서

<Outlet/>

을 사용해야합니다. 하위경로가 렌더링될때 중첩된 ui가 표시될 수 없다.
부모 라우트가 정확히 일치하면서 자식 인덱스 라우트를 렌더링하거나 인덱스 라우트가 없으면 아무것도 렌더링하지 않는다.

function App(){
	return (
    <div>
      <h1>Welcome to the app!</h1>
      <nav>
      	<Link to="/">Home</Link>
      	<Link to="/teams">Teams</Link>
      </nav>
      <div>
      <Outlet />
      </div>
      </div>
    )
}

=> app컴포넌트가 레이아웃 컴포넌트가 되는 것

useLocation?

현재위치 객체를 반환한다. 현재 위치가 변경될 때 마다 일부 side effect를 수행하려는 경우 유용하다

0개의 댓글