항해99 개발일지
useState와 for가 무슨상관이 있을까..?
변기원
2022. 5. 1. 13:50
현재까지 realtime database를 이용하여 실시간 기능까지 구현하고
이제 여행계획 일차수에 맞게 db에 추가하고 읽어오는 기능을 구현하려 했다.
각 버튼을 함수형컴포넌트를 이용해 동적으로 생성했고, dateCnt를 받아서 해당 날짜 수만큼 출력했다.
그리고 각 버튼에 onClick이벤트를 주어 해당하는 일차를 클릭할 때 마다 state를 바꿔가며 관리하려고 했다.

일단 처음에 아무 날짜도 선택하지 않았을때 역시 검색이 잘 된다.

근데 날짜를 day3으로 선택하고 검색을 해보니 뭔가 에러가 나왔다.
하나하나 찍어가며 찾아보니 검색과 동시에 15개의 정보는 제대로 가져오지만
state가 지정됐을때는, 그 정보를 토대로 마커를 생성하는 for문이 제대로 돌지 않는다는 에러를 발견했다.
에러는 마커가 없으니 addListener를 붙일 수 없다는 에러인 것 같다.

지도api에서 마커를 생성하는 for문

컴포넌트로 추가한 버튼, 거기에 등록한 온클릭함수
해결: 카카오지도 관련 코드를 전부 리액트 코드로 바꿈!