React

Web

[ReactRouter] 6.22 변경사항 적용해보기

기존 라우팅 방식 //router.tsx //app.tsx 달라진 라우팅 방식 브라우저라우터를 사용하지 않고 routeProvider를 사용한다. //router.tsx const router = createBrowserRouter([ { id: 'rootLayout', element: , children: [ { id: 'index', path: '/', element: , }, { id: 'edit', path: '/edit', element: , }, ], }, ]) //app.tsx const App = (): React.ReactElement => { return ( ) } NavLink 활용 `${styles.container} ${isActive && styles.active}`}> {men..

Web

[react-router-dom] nav를 회원가입, 로그인 페이지에서 가리기

버전 1. react: 18.2.0 2. typescript 3. react-router-dom : 6.14.1 const PageNavWithHide = (): JSX.Element | null => { const location = useLocation() const hidePageNav = location.pathname === "/login" || location.pathname === "/signup" if (hidePageNav) { return null } return } login, signup일때 null을 리턴함 그외에는 PageNav컴포넌트를 리턴 잘 적용된 모습

_이앎
'React' 태그의 글 목록 (2 Page)