리액트 google is not defined

Question

우선 저는 google-map-react를 활용해서 구글 지도를 불러오고 마커를 찍고 있었습니다거기에 구글 경로 api를 활용해서 경로를 보여주는 기능을 추가하고자 하여서 https://stackoverflow.com/questions/53806359/react-how-can-i-draw-a-route-with-google-map-react를 참고하였습니다https://stackblitz.com/edit/direction-google-map-react-bphz8g?file=Map.js,index.js여기 답변이 클래스 컴포넌트로 작성되어 있는데import React, { Component } from 'react';import GoogleMapReact from 'google-map-react';import './style.css';class GoogleMaps extends Component { constructor(props) { super(props); this.state = { currentLocation: { lat: 40.756795, lng: -73.954298 }, }; } render() { const apiIsLoaded = (map, maps) => { const directionsService = new google.maps.DirectionsService(); const directionsRenderer = new google.maps.DirectionsRenderer(); directionsRenderer.setMap(map); const origin = { lat: 40.756795, lng: -79.954298 }; const destination = { lat: 41.756795, lng: -78.954298 }; directionsService.route( { origin: origin, destination: destination, travelMode: google.maps.TravelMode.DRIVING, }, (result, status) => { if (status === google.maps.DirectionsStatus.OK) { directionsRenderer.setDirections(result); } else { console.error(error fetching directions ${result}); } } ); }; return (

apiIsLoaded(map, maps)} />

); }}export default GoogleMaps;저는 함수 컴포넌트로 작성해서 const apiIsLoaded = (map, maps) => { const directionsService = new google.maps.DirectionsService(); const directionsRenderer = new google.maps.DirectionsRenderer(); directionsRenderer.setMap(map); const origin = { lat: 40.756795, lng: -79.954298 }; const destination = { lat: 41.756795, lng: -78.954298 }; directionsService.route( { origin: origin, destination: destination, travelMode: google.maps.TravelMode.DRIVING, }, (result, status) => { if (status === google.maps.DirectionsStatus.OK) { directionsRenderer.setDirections(result); } else { console.error(error fetching directions ${result}); } } ); };이 부분을 제 코드에 추가하면google is not defined라고 에러 메시지가 출력됩니다혹시 해결방법 아시는 분 계신지 궁금합니다

인성 절구로 빻음 · Accepted Answer

어떠한것을 참조하셨는지도 남겨주시면 좋을 것 같네요소스코드에서 new google.maps가 있는데 이건 어디서 참조하신건가요?https://github.com/google-map-react/google-map-react-examples/blob/master/src/examples/Main.js#L69

헤이동춘 · Answer

new window.google.maps.~~~ 이렇게 해보실래요?

리액트 google is not defined

2개의 답변

#googleapi 목록