WIL 9 ( Weeked I Learned ) - 22/07/09

오늘은 좀 다양한 에러가 많았다.

1. 카카오 지도 API의 services 에러
   카카오 API 라이브러리를 불러올려면 추가로 불러서 사용해야 한다. 파라미터에 추가하여 로드해야한다.

<script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=APIKEY&​libraries=services"></script>

저런 식으로 라이브러리를 넣어야 한다.
카카오 지도 API 링크 - https://apis.map.kakao.com/web/guide/#loadlibrary

2. 리액트 라이브러리 에러 - React DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node

특정 태그에서 에러가 나는 증상이었다. 나는 다음과 같은 코드였다.

다음 주소 검색 API 호출에 따라 useState를 사용해서 보여주기를 하였는데

{visible ? (
            <>
              <DaumPostCode
                onComplete={handleComplete}
                style={addressStyle}
                autoClose
                height={700}
              />
            </>
          ) : null}

이렇게 Fragment를 쓰니 오류가 났다.

그래서

{visible ? (
            <div>
              <DaumPostCode
                onComplete={handleComplete}
                style={addressStyle}
                autoClose
                height={700}
              />
            </div>
          ) : null}

다음과 같이 해결하였다.

지금은 렌더링 시, 카카오 지도 API 의 Geocoder가 말썽이다.

뭔가 비동기 처리가 되서 바로 안 뜨는 것 같은데... 아직 더 확인이 필요하다.