vue 解决edge和chrome 点击事件触发mouseleave事件

vue获取event

1. 不填写时，默认第一个参数就是 event 对象。

   <div @mouseleave="photoLeave">
   

2. 必须是 $event 的写法，该参数位置可随意，也可放在第一个。

   <div @mouseleave="photoLeave($event)">
   

event.relatedTarget

通过点击错误触发的移出事件和真正的移出事件，它们对应的event.relatedTarget是不一样的。将他们log一下，做判断
relatedTarget 事件属性返回与事件的目标节点相关的节点。
对于 mouseover 事件来说，该属性是鼠标指针移到目标节点上时所离开的那个节点，mouseleavet同理。
对于 mouseout 事件来说，该属性是离开目标时，鼠标指针进入的节点。

在对应函数中做判断

因为鼠标点击和鼠标移出触发的mouseleave，对应的relatedTarget是不一样的，将他们log一下，做判断，我这里因为项目用了elmentui的加载效果，所以会存在一层loading，根据这个做判断。如果没有这个，应该是null

    photoLeave(event) {
      // 阻止点击事件触发mouseLeave事件
      if (event && event.relatedTarget) {
        if (/el-loading/.test(event.relatedTarget.innerHTML)) {
          console.log('阻止点击事件触发mouseLeave事件:', event.relatedTarget, event.relatedTarget.innerHTML);
        } else {
		 做操作
        }
      }