next.js route.qurey is undefined

useRoute를 사용했을 때 route.qurey가 바로 반환되는 것이 아닌 딜레이가 생겨 백으로 get 요청을 제대로 보내지 못할 때가 있다 

 

useEffect는 router의 딜레이를 기다려주지 않기 때문에 결국 post/1 이 아닌 post/undefined 로 요청을 보내는 문제가 있었다. 

 

hooks는 컴포넌트 최상위에 위치해야해서 이펙트에 담을 수 없다

 

해결법은 router.isReady 메서드를 담을 변수를 만들어 로딩을 판별하고 

 

useEffect의 두번째 인자로 위 로딩 감시 변수를 넣어 감시한다 

 

아울러 jsx부분에서도 위와 같은 플레그를 활용하여 예외 처리한다.