2017-08-03 38 views
0

我的问题是如何在mouseover上运行一次Vue方法,而不是在mousein和mouseout上运行它。Vue.js 2/Javascript mouseover方法在mousein和mouseout上应用事件

例如,下面是我使用Vue公司,在那里我通过一些数据循环的模板,我希望有一个叫showSkill()方法只火一次,它是目前mousein /鼠标移开发射两个:

<div class="col-md-3" v-for="skill in skills" :key="skill.id"> 
    <label :for="skill.nickname">{{ skill.name }}</label> 
    <div :id="skill.nickname" @mouseover="showSkill(skill)"></div> 
</div> 

这里是方法:

showSkill(skill) { 
    jQuery(`#${skill.nickname}`).empty() 
    this.drawDonutChart(`#${skill.nickname}`, (skill.level/100).toFixed(2) * 100, 200, 200, '.35em') 
}, 

我觉得这是一个事件的问题比Vue公司的问题更多。任何建议将不胜感激!

+0

我只能让它开火一次。 [小提琴](https://jsfiddle.net/f2b513uo/)。 –

回答

2

使用once修饰符。

<div :id="skill.nickname" @mouseover.once="showSkill(skill)"></div> 
+0

这是一个了不起的功能,正是我一直在寻找的。谢谢Bert! – lnamba