如何实现Vue中的鼠标悬停事件监听功能？

本文共计515个文字，预计阅读时间需要3分钟。

目录+前言+场景描述+解决方案+总结+前言+开发框架为+Vue2.x+场景描述+需求是这样的：页面在鼠标悬停（不动）n秒后，页面进行相应的事件处理。例如，在我的需求下，鼠标悬停15秒后，页面执行相关事件。

目录

• 前言
• 情景描述
• 解决方法
• 总结

前言

开发框架为 vue2.x

情景描述

需求是这样的：页面在鼠标悬停（不动）n秒之后，页面进行相应的事件。

比如在我的需求下，是鼠标悬停15秒之后，页面上三个数据弹窗轮询展示。

解决方法

我的思路中 涉及到了三个变量

data(){ return { polling: null, timeCount: 0, judgeTimer: null, } }

polling： 是 轮询的时候的一个计时器
timeCount： 是 判断鼠标是否移动的一个控制变量
judgeTimer：是 判断鼠标是否移动的一个计时器

只要鼠标进行了移动，那么 timeCount就会发生变化。