NodeJS 事件处理程序在使用react-leaflet的弹出窗口中不起作用

wlwcrazw  于 2023-04-29  发布在  Node.js
关注(0)|答案(1)|浏览(108)

当我尝试在弹出窗口中使用eventHandlers时,我在react-leaflet中遇到了一个问题,我的逻辑是,当我悬停在标记上时,它会打开一个弹出窗口,当我悬停在弹出窗口外时,它会关闭,但它不起作用,这是我的代码:

<Marker
            position={stream.coordinate}
            key={stream.id}
            eventHandlers={{
              mouseover: (e) => {
                e.target.openPopup();
              },
              mouseout: (e) => {
                setTimeout(() => {
                  e.target.closePopup();
                }, 1000);
              },
              click: (e) => {
                setDisplayRoute(true);
                setSelected(stream.id);
              },
            }}
          >
            <Popup 
              eventHandlers={{
                mouseover: (e) => {
                  e.target.openPopup();
                },
                mouseout: (e) => {
                    e.target.closePopup();
                },
              }}
            >
gk7wooem

gk7wooem1#

很简单!所有你需要做的就是添加属性“interactive”到你的弹出窗口(它也与工具提示一起工作)。

<Popup 
  eventHandlers={{
    mouseover: (e) => {
      e.target.openPopup();
    },
    mouseout: (e) => {
      e.target.closePopup();
    },
  }}
  interactive //Magic happens here
>

希望它能有所帮助,即使它已经快2年了哈哈

相关问题