useEffect 안에서 만든 함수에 대해 질문 있습니다.

[김다빈]

        function setCenter(){
           
            var moveLatLon = new kakao.map.LatLng(33.452613, 126.570888);
            
            map.setCenter(moveLatLon);
        }

        function panTo(){
           
            var moveLatLon = new kakao.map.LatLng(33.450580, 126.574942);
            
            map.panBy(moveLatLon);
        }
    }, []);

    return (
        <>
            <div id='myMap' style={{width: '500px',height: '500px'}}></div>
            <button onClick={setCenter}>지도 중심좌표 이동시키기</button>
            <button onClick={panTo}>지도 중심좌표 부드럽게 이동시키기</button>
        </>

useEffect 안에서 만든 setCenter, panTo 함수 두개를 밖에서도 사용 하고 싶은데 혹시 사용할 수 있는 방법이 있을까요?
button의 onClick에 넣어서 함수를 실행시키려고 합니다!

[codingapple]

    return ( 윗줄에 함수정의 넣어도될거같은데요

[김다빈]

useEffect 안에 const map = new kakao.maps.Map(container, options); 이란 변수를 만들어놔서
두 함수에서 이 변수를 필요로 하니까 밖으로 못꺼내고 있어요 ㅠㅠ!

[codingapple]

그 코드도 useEffect 밖으로 빼거나
함수 파라미터로 map변수 입력할 수 있게 만들거나 합시다

[글쓴이]

글