I'm attempting to execute a function when the cursor hovers over a list item as shown below:
<div id="vue-app">
<ul>
<li v-for="item in items" @mouseover="removeItem(item)">{{item}}</li>
</ul>
</div>
new Vue({
el: '#vue-app',
data: {
items: ['meat', 'fruits', 'vegetables'],
},
methods: {
removeItem(value) {
...
}
},
});
however, the mouseover event only triggers when I click on the list item. What am I missing here?
MouseOver
https://i.sstatic.net/ONdJp.png
MouseClicked