FR_page.7

전에 지도에서 위치를 찾을 때, 현재의 위치로만 보여지는 부분에서 주소가 할당되어 있을 때 할당된 위치가 보이도록 변경했다.

위치를 매개변수를 받아와, 만약 위치가 지정되어있으면 그 위치를 표시해주고, lat / lng이 모두 0이면 현재의 위치를 받아오도록 했다.

const getMaps = useCallback((a, b) => {
	console.log("a, b", a,b)
	kakao.maps.load(async () => {
		let container = document.getElementById('kakaoMap3');
		if (!container) return;
		let lat = 0;
		let lng = 0;
		//console.log("lat,lng", formikRef.current.values.lat, formikRef.current.values.lng);
		// if(formikRef.current.values.lat===0 && formikRef.current.values.lng===0){
		if(a===0 && b === 0){
			lat = Location.latitude;
			lng = Location.longitude;
			console.log("현재위치");
		}
		else{
			lat = a;
			lng = b;
			console.log("지정 위치");
		}

추가로 현재 할당된 위치가 아닌, 현재의 위치를 찾고싶을 때에도 아이콘을 클릭해 찾을 수 있도록 해주었다.

<Icon
	icon="Loca"
	fontFamily="material-icons"
	fontSize="35"
	style={{
		
		position: 'absolute',
		top: '10px',
		right: '10px', // 원하는 위치에 아이콘 배치
		zIndex: 10, // iframe 위에 표시
		cursor: 'pointer',
		backgroundColor: 'transparent',
		borderRadius: '50%',
		padding: '5px',
		color:"#FF0000"
	}}
	onClick={() => {
		getMaps(0, 0);
	}}
/>         

여기서, 현재 위치가 로드될 때 주소 필드에 적용이 안되는 문제점이 발생하였다.

이 문제점을 setTimeout으로 설정해 상태 업데이트 반영을 보장해주었다.

geocoder.coord2Address(lng, lat, function (result, status) {
	if (status === kakao.maps.services.Status.OK) {
		const _arr = result[0].address.address_name;
		console.log("변환된 주소:", _arr);

		if (formikRef.current) {
			setTimeout(() => {  // 상태 업데이트 반영 보장
				formikRef.current.setFieldValue('customerAddress', _arr);
			}, 100);
		} else {
			console.error("Formik Ref가 초기화되지 않았습니다.");
		}
	}
});;