我在谷歌地图反应库中遇到错误



我的google-maps-react库(https://www.npmjs.com/package/google-maps-react(有错误。我正在使用打字稿和 React,该组件需要一个"谷歌"的道具,我不知道它是什么。

import { Map, Marker, GoogleApiWrapper } from 'google-maps-react';
import * as React from 'react';
import { IMapContainerProps } from './IMapContainerProps';
export class MapFuncionando extends React.Component<IMapContainerProps, {}> {
public render(): React.ReactElement<IMapContainerProps> {
return (
<div>
{
<Map google={this.props.google} zoom={this.props.zoomLevel}
initialCenter={{ lat: this.props.latCenter, lng: this.props.lngCenter }}>
<Marker position={{ lat: this.props.latMarker, lng: this.props.lngMarker }} />
</Map>
}
</div>
);
}
}
const LoadingContainer = (props: any) => (
<div>Fancy loading container!</div>
);
export default GoogleApiWrapper(
(props) => ({
apiKey: props.apikey,
LoadingContainer: LoadingContainer,
language: 'es'
}
))(MapContainer);

我用下一行调用此组件:

<MapContainer apikey={'myapikey'} google={''} zoomLevel={15} latCenter={value1} lngCenter={value2} latMarker={value3} lngMarker={value4} />

我遇到的错误是:

index.js:2178 Warning: Failed prop type: Invalid prop `google` of type `string` supplied to `Map`, expected `object`.
in Map (created by MapContainer)
in MapContainer (created by Party)
in div (created by Col)
in Col (created by Party)
in div (created by Row)
in Row (created by Party)
in div (created by Container)
in Container (created by Party)
in div (created by Party)
in Party (created by App)
in main (created by App)
in div (created by App)
in App

据推测,GoogleApiWrapper包含此道具,并且该道具的后缀值是window.google,正如文档所说,但我不知道它是什么...

根据文档(和你的错误(,谷歌道具应该是一个对象,显然指的是window.google对象:

如果您不想使用自动加载选项,也可以将 window.google 实例作为道具传递给您的组件。

<Map google={window.google} />

相关内容

  • 没有找到相关文章

最新更新