如何在鼠标悬停时在react-leaflet中切换弹出窗口

Question

我尝试了在google上找到的所有内容，但不知道如何触发弹出窗口。

<Marker
  position={this.props.position}
  onMouseOver={() => { openPopup() }}
  onMouseOut={() => { closePopup() }}
>
  <Popup>
     "HI"
  </Popup>
</Marker>

注意：我知道我无法触发功能openPopup，只是为了显示我要在何处实现触发功能以在鼠标悬停时切换弹出窗口。

有人可以帮忙吗，谢谢。

Answer 1

可以通过和事件的event.target属性访问Leaflet Marker对象，因此可以像这样打开/关闭弹出窗口：mouseovermouseout

<Marker
    position={position}
    onMouseOver={(e) => {
      e.target.openPopup();
    }}
    onMouseOut={(e) => {
      e.target.closePopup();
    }}
  >
    <Popup>Sydney</Popup>
  </Marker>

演示版