asyncData, fetch(context) , fetch()

Question

강의 너무 잘 듣고있는데 공부 중에 이것저것 호출해보면서 궁금증이 생겨서 질문드립니다.   fetch 메소드에 파라미터(context)가 있냐 없냐에 따라서 동작방식이 다름은 이해했습니다. 동작하는 순서도 다르구요 ex. fetch(context) => beforeCreate() 이전에 호출 fetch() =>  created() 이후에 호출   router로 이동시에는 CSR만 동작하는 걸로 아는데 여기서 궁금증이 있습니다. fetch()인경우 깜빡거리는데 asyncData와 fetch(context) 경우 깜빡거리지 않던데 이유를 알 수있을까요? CSR에서 asyncData와 fetch(context)가 호출되는 것은 알지만 그런 이유라면 fetch()는 깜빡거리는 이유를 잘 모르겠어서요. asyncData와 fetch(context)는 CSR에서 호출되더라도 무조건 SSR로 동작하는건지 궁금합니다.

ns9337 · Answer

답변 감사합니다! 그런데 제가 질문을 잘못드린것 같아서..   어떤 부분인지 영상을 찍었는데 첨부가 안되서 링크로 걸어두었습니다..ㅠ https://kimjunbo.tistory.com/6 영상을 보면 fetch(context)는 새로진입을 하든 라우터로 이동을 하든 깜빡이지 않았습니다. 라우터로 이동할때는 SSR 콘솔이 안찍혔는데 말이죠.. 라우터로 이동해서 CSR에서 fetch(context)가 호출되었는데 깜빡거리지가 않아서 그 이유를 알 수 있을까요?

captain · Answer

안녕하세요 좋은 질문이네요 :) fetch()가 깜빡 거리는 이유는 클라이언트 사이드에서 렌더링 되었기 때문에 그렇습니다. 서버 사이드 렌더링 된 경우에는 깜빡 거리지 않고 데이터가 채워져서 화면이 표시될 거예요. 자세한 동작 방식은 아래 문서 추가로 참고해 보세요 :) https://nuxtjs.org/docs/components-glossary/fetch#the-fetch-hook