인프런 커뮤니티 질문&답변
작성한 질문수
props 전달 질문
작성
·
200
0
index.tsx에서
const Home = ({ allPostsData }:
이 부분의 allPostsData가 어디에서 온건지 이해가 안됩니다. index.tsx 에서 밑에
export const getStaticProps: GetStaticProps = async () => { const allPostsData = getSortedPostsData() return { props: { allPostsData } }}
여기에 const allPostsData가 선언되긴 했지만 const는 블록레벨 스코프라서 getStaticProps안에서만 유효한 변수 아닌가요??
그리고 return 을 그냥 하는게 아니라 props : { ...} 로 하는 이유도 궁금합니다!!
답변 1
1
안녕하세요!
현재 저희가 Nextjs를 사용하고 있습니다.
블록 레벨 스코프이지만 Nextjs 내부에서 서버를 시작할 때 NextJS 가 알아서 getStaticProps 안에서 로직 처리 후 props를 컴포넌트에 보내주는 것입니다.
return 해서 props로 보내는 이유도
코딩은 결국 언어이기 때문입니다. 다른 말로 하면 약속이기도 합니다.
누군가 return 후 props로 보내야 된다고 약속해놨기 때문에 저희는 return 안에 props로 보내주는 것입니다.
그 약속해놓은 방식은 그 해당 라이브러리나 프레임워크에 설명서에서 보실 수 있습니다.
감사합니다!!
https://nextjs.org/docs/basic-features/data-fetching/get-static-props