我的组件代码如下:
export default class map extends React.Component {
drwmap() {
let mapOptions = {
zoom: zoom,
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: new google.maps.LatLng(this.lat, this.lng),
mapTypeControl: true,
mapTypeControlOptions: {
position: google.maps.ControlPosition.LEFT_BOTTOM
},
streetViewControl: true,
minZoom: 2,
};
// here also this.lat and this.lng are not avilable
this.map = new google.maps.Map(document.getElementById('mapdiv'), mapOptions);
}
loadmap(event) {
geocoder.geocode({'address': this.place}, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
let lat = results[0].geometry.location.lat();
let lng = results[0].geometry.location.lng();
// here this is window looks google map modified scope and I dont have access to this of react
this.lat = lat;
this.lng = lng;
this.drwmap();
}
});
}
componentDidMount() {
this.loadmap();
}
}
当我在reactjs中使用Google地图进行地理编码时,我将其作为窗口值。看起来googlemaps正在用其他一些值覆盖它,并且反应的范围不可用。
如何使其可用,以便我可以在组件中使用公共变量?
答案 0 :(得分:0)
我在反应中使用箭头功能解决了这个问题。
this.geocoder.geocode({'address': this.place},(results, status) => {
/ / here this is available as component
});