vue文件中的写法
<template> <div @mouseenter="handleEnter" @mouseleave="handleLeave"></div> </template> <script> export default { data() { return { tabVisible: false, t: null, }; }, methods: { handleEnter() { // 避免鼠标事件太灵敏 this.t = setTimeout(() => { this.tabVisible = true; }, 500); }, handleLeave() { // 鼠标移出时,马上清除,避免闪烁 clearTimeout(this.t); setTimeout(() => { this.tabVisible = false; }, 500); }, } } </script>