鼠标移出时关闭信息窗口

Question

离开时如何隐藏信息window？我希望鼠标一离开infowindow就可以隐藏它。我在这里使用这个 vue 包：https://github.com/xkjyeah/vue-google-maps/issues/428

我试过这样的东西：

this.$nextTick(function() {
  self.$refs.gmap.$mapPromise.then(function(map){ // ensures that map 
                                                  object is ready and exists
    google.maps.event.addListener(self.infoWindow, 'mouseout', // self.infoWindow is infoWindow instance, 
                                                                  I am only using one and change content
    function(){
      self.infoWindow.infoWinOpen = false; // way of vue-google-maps 
                                              to close 
                                              infowindow
    });
  });
});

这不起作用，当我尝试将它直接应用于标记时，它仅在我鼠标移出时应用于标记而不应用于信息window，这意味着我一离开标记并想移动到 infowindow，infowindow 关闭。谁能告诉我如何在鼠标离开window时立即关闭信息window？

Answer 1

如果您想在鼠标离开时隐藏某些内容，只需向该元素添加一个 @mouseleave 侦听器即可。

这是你想要做的吗？

Codepen: https://codepen.io/x84733/pen/GGYwEg?editors=1010

<div @mouseleave="hide = true" v-if="hide == false"></div>

...

data: () => ({
  hide: false
})

鼠标移出时关闭信息窗口

Close infowindow when mouseout

google-maps

infowindow

vuejs2