<template>
<div :class="showFlag ? "show" : "hide"" @mouseenter="enter" @mouseleave="leave"></div>
</template>
leave() {
setTimeout(() => {
if (this.showFlag) {
this.showFlag = false
}
}, 2000)
}
as above. On the leave function, I want to delay processing the showFlag case for two seconds.
it is possible that the mouse is moved out and in within two seconds.
I need to check on settimeout to see if the mouse is over the div.
how about checking if the mouse is on the div?