我是React的新手,目前正在尝试学习如何使用react-google-maps库。试图显示地图,其中用户地理位置initialCenter与地图相同。
这是我的代码:
import React from "react";
import { GoogleApiWrapper, Map } from "google-maps-react";
export class MapContainer extends React.Component {
constructor(props) {
super(props);
this.state = { userLocation: { lat: 32, lng: 32 } };
}
componentWillMount(props) {
this.setState({
userLocation: navigator.geolocation.getCurrentPosition(
this.renderPosition
)
});
}
renderPosition(position) {
return { lat: position.coords.latitude, lng: position.coords.longitude };
}
render() {
return (
<Map
google={this.props.google}
initialCenter={this.state.userLocation}
zoom={10}
/>
);
}
}
export default GoogleApiWrapper({
apiKey: "-----------"
})(MapContainer);
Run Code Online (Sandbox Code Playgroud)
通过创建具有用户位置的地图,我得到了initialCenter默认状态值。
我该如何解决?我什至在使用生命周期功能吗?
非常感谢您的帮助