vue 鼠標移入移出事件執行多次(尤其ie)

來自：https://www.cnblogs.com/myfirstboke/p/9150809.html  侵刪

<p  @mouseover="over($event)" @mouseout="out($event)">互相關注</p>


out (t) {
  t.target.innerText = '互相關注'
},
over (t) {
  console.log(t, 1)
  console.log(t.target.innerText, 1)
  t.target.innerText = '取消關注'
},
 不能這么寫，這么寫的話ie10點擊取消關注會卡死，應為mouseover有冒泡，這里應該用mouseenter只在當前，不用event

****************************************************************************************************

****************************************************************************************************

最好這么寫

<p class="focus-span" v-if="item.concernStatus==2" @click="focusTogether(item.userId)" @mouseenter="over" @mouseleave="out">{{msg}}</p>
data里面
msg:'互相關注'
out () {
  this.msg = '互相關注'
},
over () {
  this.msg = '取消關注'
},
不論鼠標指針穿過被選元素或其子元素，都會觸發 mouseover 事件。對應mouseout；相當於有冒泡
只有在鼠標指針穿過被選元素時，才會觸發 mouseenter 事件。對應mouseleave
這樣的話，mouseenter子元素不會反復觸發事件，否則在IE中經常有閃爍情況發生。這就時為啥ie兼容的時候要卡死