ref가 인식이 안됩니다.

[junyub301]

  const mapRef = useRef<kakao.maps.Map>(null);

useEffect(() => {
   if (mapRef.current){
      const map = mapRef.current;
      if (!map) return;

      const sw = map.getBounds().getSouthWest(); 
      const ne = map.getBounds().getNorthEast(); 
     // ....
  }
},[mapRef]}

...
return <Map ref={mapRef} ... />

현재 이렇게 작업을 불러오려고 하는데 지도는 load되는데 mapRef가 인식이 안됩니다. 인식을 하려면 지도를 조금이라도 움직여야 동작을 하는데 확인 부탁 드립니다.

[JaeSeoKim]

@junyub301 Ref 객체는 변화가 생기더라도 ReRendering를 발생하지 않는 객체 입니다.

아래와 같이 useState 를 사용하여 핸들링 해주세요.

  const [map, setMap] = useState<kakao.maps.Map>(null);

useEffect(() => {
   if (map){
      const sw = map.getBounds().getSouthWest(); 
      const ne = map.getBounds().getNorthEast(); 
     // ....
  }
},[map]}

...
return <Map ref={setMap} ... />

Ref의 경우 렌더링을 최소화 시킬수 있는 용도로 만들어둔 부분으로, onCreate 이벤트나, ref 에 setState 를 전달하는 방식으로 사용하시는 것을 권장합니다.