mouseover event not firing till clicked on Google Chrome

Question

I'm trying to run a function when the cursor is over a list item like so:

<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 fires when I click on the list item. What am I not doing correct here?

MouseOver

MouseClicked

That's generally all the code, I've added screenshots, not sure if they will help though — Boron, Feb 28 '19 at 07:20
check the working code as answer, I will remove this in some time — Niklesh Raut, Feb 28 '19 at 07:28
If by any chance you are using a custom component then see this answer: https://stackoverflow.com/questions/46293996/why-mouseover-action-in-vue-cannot-work — JBeagle, Feb 28 '19 at 08:55
I am seeing the same issue, anyone figure out why this is happening? Sometimes if I wait like 20-30 seconds, the event eventually gets triggered. — sumG, Jun 30 '21 at 15:05

score 0 · Answer 1 · answered Feb 28 '19 at 07:27

0

Check this working code

new Vue({
    el:'#vue-app',
    data:{
        items:['meat','fruits','vegetables'],
    },
    methods:{
        removeItem(value){
          console.log(value);
        }
    },
  });

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.7/vue.js"></script>
<div id="vue-app">
        <ul>
            <li v-for="item in items" @mouseover="removeItem(item)">{{item}}</li>
        </ul>
</div>

answered Feb 28 '19 at 07:27

Niklesh Raut

34,013
16
75
109

I've noted that the code above and this one does not work on chrome. Tested it on mozilla firefox and it works correctly – Boron Feb 28 '19 at 08:28
I am using chrome and it is working in chrome also.what version you are using for chrome ? – Niklesh Raut Feb 28 '19 at 09:13
Version 72.0.3626.119 (Official Build) (64-bit) – Boron Feb 28 '19 at 11:03
what if you check above snippet in you current browser ? there must be other issue it is working in this version. – Niklesh Raut Feb 28 '19 at 11:18

mouseover event not firing till clicked on Google Chrome

1 Answers1