SearchForm, Menu, Header컴포넌트 마이그레이션, 404일때 url 주소 변경 #60
Conversation
hhhyyo
added
🌟 feature
| const router = useRouter(); | ||
|
|
||
| useEffect(() => { | ||
| router.push('/404', undefined, { shallow: true }); |
There was a problem hiding this comment.
헐... 이런 간단한 방법이!! ㅋㅋ 효원님 천재네요!
There was a problem hiding this comment.
근데 이렇게 하면 404 컴포넌트가 로드된 후 한 번 더 html이 로드되면서 리다이렉트 되는건가요?
There was a problem hiding this comment.
리다이렉트 후 뒤로가기 눌렀을 때 잘못된 url로 되돌아가는 걸 막고 싶으면 router.replace로 작업하는것도 생각해봐야 할 것 같아요.
https://nextjs.org/docs/api-reference/next/router#routerreplace
There was a problem hiding this comment.
shallow 옵션을 주면 다시 실행 하지 않고 현재 페이지의 경로를 업데이트한다고 합니다!
저는 router.push랑 replace랑 동일하게 작동한다고 해석했는데 replace가 좀 더 명확할거같네요!
https://nextjs.org/docs/api-reference/next/router#routerpush
| document.removeEventListener('scroll', controlHeader); | ||
| document.removeEventListener('scroll', controlScrollToTop); | ||
| }; | ||
| }, []); |
There was a problem hiding this comment.
커스텀 훅으로 만들어서 사용하면 깔끔할것 같습니다~
| }, []); | ||
|
|
||
| return ( | ||
| <EmptyPage> |
There was a problem hiding this comment.
404 페이지도 필요하다면 next/head를 통해 메타태그를 달아주면 좋을것 같아요
There was a problem hiding this comment.
어떤 내용이 들어갈지 생각해봐야될 것 같습니다!
| const router = useRouter(); | ||
|
|
||
| useEffect(() => { | ||
| router.push('/404', undefined, { shallow: true }); |
There was a problem hiding this comment.
shallow 옵션을 주면 다시 실행 하지 않고 현재 페이지의 경로를 업데이트한다고 합니다!
https://nextjs.org/docs/api-reference/next/router#routerpush
4 participants
PR Type
What kind of change does this PR introduce?
Related Issues
#25
#27
#28
#29
#37
What does this PR do?
Other information
헤더에서 인증관련 부분은 일단 제외했습니다.
스토리북에서 next.js useRouter 사용할 수 있게되면 주석을 해제해야하는 코드가 있습니다.