fed-gren / react-kakao-maps

React library for using Kakao map API
https://www.npmjs.com/package/react-kakao-maps
5 stars 4 forks source link

KakaoMapContext 사용 문의 #7

Closed fison67s closed 4 years ago

fison67s commented 4 years ago

안녕하세요. 먼저 감사의 말씀 드립니다.

React를 처음 사용해보면서 만들어주신 kakao map을 사용해 보려고 합니다.

map 생성된거에 접근해서 커스텀오버레이를 드래그 해보고 싶어서 생성된 map을 가져 오려고 하는데 며칠을 해봐도 잘 모르겠습니다..

import KakaoMapContext, { KakaoMap, Marker, CustomOverlay } from "react-kakao-maps";

const {kakaoMapObj, map} = useContext(KakaoMapContext);

이렇게 불러와서 map 을 사용하려고 하면 undefined 네요. 어떻게 map를 가져올 수 있나요?

react는 function component를 사용하고 있습니다.

fed-gren commented 4 years ago

안녕하세요. :) 혹시 map을 호출하는 시기가 어떻게 되나요? 스크립트를 비동기로 불러오기 때문에 맵이 모두 불러오기 전에 map을 체크하셨다면 undefined일 겁니다. 저는 useEffect에서 map이 존재하는지 확인 한 뒤 map을 사용하여 작업하였습니다.

fison67s commented 4 years ago

죄송합니다..

전 임의의 컴퍼넌트를 만들고 거기서 KakaoMap을 넣고 context를 가져오려고 했는데 Context는 하위 컴퍼넌트에서만 사용이 가능한가 보네요.

한가지 더 궁금한게 있는데 이런식으로 구현하는게 맞을까요?

커스텀 오버레이에 텍스트 및 버튼을 넣고 버튼이벤트 발생시 react에서 무언갈 하고 싶은데 카카오 api 에서 직접 렌더링해서 버튼을 react에서 따로 연결 할 수가 없는것 같네요. jquery를 사용해서 이벤트 발생시 react에서 어떤 동작을 하는게 가능할까요?

감사합니다.

fed-gren commented 4 years ago

말씀하신대로 카카오 api에서 직접 렌더링을 해서 커스텀 오버레이에 이벤트를 주는 과정이 쉽진 않았는데요.. 커스텀 오버레이를 문자열 html로 작성하신 뒤 태그에 속성으로 이벤트를 주시는 방법이 가능할 거 같긴 합니다. http://apis.map.kakao.com/web/sample/removableCustomOverlay/

fison67s commented 4 years ago

네 감사합니다!