[Error] Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.

카카오 주소 찾기 api를 사용해서 주소찾기 form을 만드는데,

 

이런 오류가 났다.

 

콘솔에 제대로 data가 들어오는게 찍히는데, 문제는 removechild가 되지 않는다는 것이었다.

해결방법은 의외로 쉬웠다.

 

 

 

 

 

오류난 코드

 

{isOpen && (
          <DaumPostcode
            theme={themeObj}
            style={postCodeStyle}
            onComplete={completeHandler}
            onClose={closeHandler}
          />
)}

 

이렇게 버튼을 클릭한 경우에만 DaumPostcode가 실행되도록 해주었는데 계속 오류가 났다.

 

 

 

 

 

해결한 코드

 

{isOpen && (
        <div>
          <DaumPostcode
            theme={themeObj}
            style={postCodeStyle}
            onComplete={completeHandler}
            onClose={closeHandler}
          />
        </div>
      )}

 

이렇게 div로 DaumPostcode를 감싸주니 간단하게 해결되었다.

 

 

 

 

 

 

 

---

참고한 글들

https://velog.io/@hamham/%EC%B9%B4%EC%B9%B4%EC%98%A4-API-%EC%A3%BC%EC%86%8C-%EC%B0%BE%EA%B8%B0

[kakao API] 주소찾기 폼 만들기

https://stackoverflow.com/questions/48358529/failed-to-execute-removechild-on-node-with-fontawesome-in-react

Failed to execute 'removeChild' on 'Node' with FontAwesome in React