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

박아무개님의 프로필 이미지
박아무개

작성한 질문수

Next.js 시작하기(feat. 지도 서비스 개발)

매장 선택 기능 추가하기(map event 처리하기)

useEffect clean up function 내부 코드의 역할

해결된 질문

작성

·

252

·

수정됨

2

      return () => {
        marker?.setMap(null)
      }

해당 코드는 어떤 역할을 하는건가요??

답변 1

0

박용주님의 프로필 이미지
박용주
지식공유자

안녕하세요 질문 감사합니다!

알고 계시는 바와 같이 해당 코드는 Marker 컴포넌트가 unmount 될 때 실행될 것입니다. 그리고 해당 코드는 naver marker 오버레이를 지도에서 제거하는 역할을 합니다. (공식 문서 참고 링크: https://navermaps.github.io/maps.js.ncp/docs/naver.maps.Marker.html#setMap__anchor)

해당 코드를 작성하지 않으면 Marker 컴포넌트가 unmount 되더라도 naver marker 오버레이는 삭제되지 않고 그대로 지도에 남아있는 버그가 발생하게 됩니다. (코드를 주석처리 한 뒤 마커를 클릭해 currentStore를 바꿔보시면 직관적으로 이해가 쉬울 것 같습니다ㅎㅎ)

감사합니다 :)

박아무개님의 프로필 이미지
박아무개

작성한 질문수

질문하기