[React] kakaomap 사용하기

디그다·2021년 12월 14일

ReferenceError: kakao is not defined 에러 발생

/****************************************
 * [as-is] 옵션 값을 가장 바깥 영역에 정의
 ****************************************/

// 지도를 담을 영역의 DOM 레퍼런스
const containerRef = useRef(null);

// 지도를 생성할 때 필요한 기본 옵션
const options = {
	// 지도의 중심좌표. (위도, 경도)
	center: new kakao.maps.LatLng(33.450701, 126.570667),
	// 지도의 레벨(확대, 축소 정도)
	level: 3
};

useEffect(() => {
    // 카카오맵 그리기
  new window.kakao.maps.Map(containerRef.current, options)
}, []);



/****************************************
 * [to-be] 옵션 값을 useEffect 내부에 정의
 ****************************************/

// 지도를 담을 영역의 DOM 레퍼런스
const containerRef = useRef(null);

useEffect(() => {
  const options = {
	// 지도를 생성할 때 필요한 기본 옵션
	// 지도의 중심좌표. (위도, 경도)
	center: new kakao.maps.LatLng(33.450701, 126.570667),
	// 지도의 레벨(확대, 축소 정도)
	level: 3
  };
  
  // 카카오맵 그리기
  new window.kakao.maps.Map(containerRef.current, options)
}, []);
profile
매일매일 삽질중인, 열심히 땅을 파고있는 개발자

0개의 댓글