我的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} />