问题描述
我正在尝试更新地图上的标记位置,我正在使用状态变量传递 lat lng 值,我有一个按钮触发器来更改标记 lat lng,但是当我这样做时,有 2地图上显示的标记,我不知道我哪里出错了。 请帮帮我
import React,{ Component } from 'react';
import { withScriptjs,withGoogleMap,GoogleMap,Marker } from 'react-google-maps';
import { compose,withProps } from 'recompose';
const MAP_com = compose(
withProps({
googleMapURL: 'https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=geometry,drawing,places&key=xxxxxxxxx',loadingElement: <div style={{ height: '100%' }} />,containerElement: <div style={{ height: '400px' }} />,mapElement: <div style={{ height: '100%' }} />,}),withScriptjs,)((props) => (
<GoogleMap defaultZoom={8} defaultCenter={{ lat: -34.397,lng: 150.644 }}>
{console.log(props)}
{props.isMarkerShown && <Marker position={props.mark} />}
</GoogleMap>
));
export default class map_1 extends Component {
constructor(props) {
super(props);
this.state = {
markerPosition: null,ch: false,};
}
click = () => {
this.setState({
markerPosition: {
lat: 12.971599,lng: 77.594566,},ch: true,});
};
render() {
return (
<div>
<button onClick={this.click}>click</button>
<button onClick={() => this.setState({ ch: true,markerPosition: { lat: -34.397,lng: 150.644 } })}>map</button>
<MAP_com isMarkerShown={this.state.ch} mark={this.state.markerPosition}></MAP_com>
</div>
);
}
}
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)