인프런 커뮤니티 질문&답변

gakaotalk님의 프로필 이미지

작성한 질문수

비전공자를 위한 진짜 입문 올인원 개발 부트캠프

[그랩마켓] React로 웹 개발하기 - 2

state 질문입니다.

작성

·

178

2

const products = result.data.products;

를 사용하여데이터를 추출하고  

products.map(function (product, index)

을 실행하였을 때 

const [products, setproducts] = React.useState([])
를 꼭 써줘야 실행이 되는 것은 비동기화 때문에 데이터가 추출되기도 전에 지나가 버리니 사용해 주는 것이 맞나요?

답변 2

1

그랩님의 프로필 이미지
그랩
지식공유자

넵! 기본적으로 네트워크 통신은 비동기 통신이기에 나중에 데이터를 받게 됐을 때 컴포넌트가 다시 렌더링을 해야지 화면에 반영이 됩니다. 만약 state를 사용하지 않으면 데이터를 받게되어 products 값을 받더라도 products.map이 다시 실행되지 않기 때문에 화면은 계속 비어있게 될 겁니다!

즉 products라는 state가 필요한 이유는 해당 컴포넌트가 렌더링(짜여진 코드를 다시 읽어서 return하는 것)을 다시해주게 하기 위해서입니다!

0

이걸 어떻게 질문하지 했는데 깔끔하고 이해하기 쉽게 질문해주셔서 감사합니다  ^^