[Hanaro] 30일차 / React Routing

04 React - Routing

• Router Hooks
  • useOutletContext
    • <Outlet context={{name: 'Hong'}} />
    • const outctx = useOutletContext<{ name: string}>();
  • useLocation & useParams
    • <Route path='/items/:id' element={<Item />}>
    • const { id } = useParams();
    • const location = useLocation();
    • const state = location.state as { x: number };
  • useSearchParams
    • const [searchParams, setSearchParams] = useSearchParams({});
• Layout
  • 하위 Route의 페이지 레이아웃 잡기
    • <Route path='/' element={<Compo />} />
    • <Route path='/items/:id' element={<Item />} />