new kakao.maps.InfoWindow({
map: myKakaoMap,
position: latlon,
content: iwContent,
removable: true
});
에서 iwContent를
content: <ReactComponent />
로 렌더링을 하고 싶습니다.
현재는 그게 안되어서 클래스 하나 만들고 html 리턴하는 함수 호출중인데 혹시 리액트 컴포넌트 렌더링 방법이 있을지 문의드립니다.
new kakao.maps.InfoWindow({
map: myKakaoMap,
position: latlon,
content: iwContent,
removable: true
});
에서 iwContent를
content: <ReactComponent />
로 렌더링을 하고 싶습니다.
현재는 그게 안되어서 클래스 하나 만들고 html 리턴하는 함수 호출중인데 혹시 리액트 컴포넌트 렌더링 방법이 있을지 문의드립니다.
content에는 String 또는 HTMLElement의 값으로 넣어주세요.
아래 링크도 참고해주세요.
https://devtalk.kakao.com/t/react-customoverlay-cors/101995/2?u=lea.ju
string으로 렌더링 할 수 있도록 방법을 찾다가 react-dom이라는 module을 찾았습니다.
렌더링까지는 되지만 onMouseOver같은 동작이 원하는대로 되지 않네요.
그럼 혹시 kakao infoWindow나 customoverlay를 생성할 때 element의 class명이나 id같은 다른 식별자가 될 만한 attribute를 설정할 수 있을까요?
content 객체에 직접적으로 이벤트를 등록해도 안되나요?
이벤트 등록은 닫기가 가능한 커스텀 오버레이 참고해주시고,
인포윈도우 혹은 커스텀 오버레이의 객체 확장은 Get 메서드 관련 질문입니다 링크 참고해주세요.
애초에 InfoWindow, CustomOverlay 모두
HTMLElement 혹은 HTML을 포함한 문자열만을 받으며
외부 프레임워크나 라이브러리로 컴포넌트화 된 객체를 받을 수 없도록 되어 있습니다.
혹여 컴포넌트에서 실제 DOM에 그려진 엘리먼트를 빼 와서 content로 지정한다고 하더라도
해당 프레임워크에서 통합 관리하는 이벤트나 데이타바인딩, 라이프사이클의 정상적인 동작을 보장받지 못할 수 있습니다.