0

我的问题是包（google-maps-react）具有显示信息窗口的默认功能

onMarkerClick = (props, marker, e) =>
  this.setState({
    selectedPlace: props,
    activeMarker: marker,
    showingInfoWindow: true
  });

以及一种特定的称呼方式

<Marker onClick={this.onMarkerClick} />

如果我 console.log(ActiveMarker) 我在照片上得到这个对象 在此处输入图像描述.. 谁能解释它是什么？因为我想用参数调用这个函数，我无法检索这个对象以将它传递给另一个函数。我需要这个，因为我想在另一个处理列表位置项目点击的函数中调用 onMarkerClick .. 提前谢谢你：slightly_smiling_face：

4

2 回答 2

0

activeMarker 对象为您提供有关您选择的标记的信息（地址、位置等）。在示例中，https ://tomchentw.github.io/react-google-maps/#infowindow ，我注意到他们有一个 infoWindow 元素，根据属性显示/隐藏 - 你的代码中有什么地方可以切换它吗？

<InfoWindow
  marker={this.state.activeMarker}
  visible={this.state.showingInfoWindow}>
    <div>
      <h1>{this.state.selectedPlace.name}</h1>
    </div>
</InfoWindow>

您当前正在更新状态以捕获标记和 selectedPlace。要触发 infoWindow 从另一个函数弹出，您只需要切换显示InfoWindow 值。您还可以检索标记信息，因为它现在是您的状态的一部分。

于 2018-08-10T13:48:13.113 回答
0

您始终可以将信息传递给新功能，例如

......
markerClicked(marker) {
   console.log('marker', marker);
   this.setState({
     activeMarker: marker,
     showingInfoWindow: true,
     selected_pin_lat: marker.position.lat(),
     selected_pin_lng: marker.position.lng(),,
   });
}

......
<Marker
  key={index}
  name={pin.type}
  position={{ lat: pin.location[0], lng: pin.location[1] }}
  onClick={(props, marker, clickEvent) => this.markerClicked(marker)}
  icon={
    new window.google.maps.MarkerImage(
      ICONS.mapPinIcon,
      null,
      null,
      null,
      new window.google.maps.Size(30, 30),
    )
  }
/>
......
于 2020-09-10T07:12:33.723 回答