쾌활한 얼룩말님의 게시글

질문&답변

[4:41] 부분 V6 에서는 이렇게 바꾸는게 맞나요??

네.. Login.js 는 export default function AccountRoutes() { return ( Routes > {/* } /> */} {/* } /> */} {/* }> } /> */} Route path="/profile/*" element={ LoginRequiredRoute />} > Route element={ Profile />} /> Route > Route path="/login" element={ Login />} /> Route path="/signup" element={ Signup />} /> Routes > ) } 이렇게 했고, LoginRequiredRoute.js 는 export default function LoginRequiredRoute({element : Component , ... kwargs }) { const {store : { isAuthenticated }} = useAppContext(); console.log('isAuthenticated : ',isAuthenticated); console.log('element : ', Component ); if ( isAuthenticated ) { } else { } return ( Routes > {/* */} {/* { */} Route path="/profile" element={ Profile />} rennder = { props => { if ( isAuthenticated ) { return Component {...props} />; } else { return Navigate replace to={{pathname : "/accounts/login", state : {from: props .location}}} /> } }} /> ; Routes > ) } 로 했는데요. {/* */} {/* { */} Route path="/profile" element={ Profile />} rennder = { props => { 이 부분을 세가지 경우를 다 써봤는데요. location.state : null 가 계속 되서, 로그인이 되어도 profile 페이지로 넘어가질 않더라구요.

고민있어요

V6. 에서 useHistory가 useNavigate 로 변경된 코딩소스 포함.