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相容的時候要卡死