我有我的地图组件
\n\nconst MyMapComponent = withScriptjs(\n withGoogleMap(props => (\n <GoogleMap\n defaultZoom={8}\n defaultCenter={{ lat: props.lat, lng: props.lng }}\n onClick={e => console.log(e)}\n >\n {props.isMarkerShown && (\n <Marker position={{ lat: props.lat, lng: props.lng }} />\n )}\n <MarkerClusterer averageCenter enableRetinaIcons gridSize={60}>\n {props.markers.map(marker => (\n <CustomMarker\n key={marker.id}\n marker={marker}\n\n />\n ))}\n </MarkerClusterer>\n </GoogleMap>\n ))\n);\nexport default MyMapComponent;\nRun Code Online (Sandbox Code Playgroud)\n\n我的应用程序组件返回此代码
\n\n return (\n <div className="container">\n <div className="map">\n// myMapComponent imported as Map\n <Map\n onMapClick={this.onMapClick}\n\n googleMapURL="https://maps.googleapis.com/maps/api/js?v=3.exp&key=YOUR_API_KEY"\n loadingElement={<div style={{ height: `100%` }} />}\n containerElement={<div style={{ height: `95vh` }} />}\n mapElement={<div style={{ …Run Code Online (Sandbox Code Playgroud) 我正在尝试访问getPlaces()应该位于StandaloneSearchBox组件中的函数react-google-maps/api。在文档和其他示例中,我们以这种方式使用它:
function Map() {\n\n // does not work.\n // Error -> \'this\' implicitly has type \'any\' because it does not have a type \n // annotation.ts(2683)\n // index.tsx(22, 10): An outer value of \'this\' is shadowed by this container.\n const onPlacesChanged = () => console.log(this.searchBox.getPlaces());\n\n return (\n <LoadScript\n googleMapsApiKey="YOUR-API-KEY"\n libraries={places}\n >\n <GoogleMap\n mapContainerStyle={containerStyle}\n center={center}\n zoom={zoom}\n >\n { /* Child components, such as markers, info windows, etc. */}\n <>\n <StandaloneSearchBox onPlacesChanged={onPlacesChanged} >\n …Run Code Online (Sandbox Code Playgroud)