介绍
vue-away 是一款 Vue.js 组件，可以在鼠标离开页面时触发一些操作，例如清空输入框、退出全屏等。它通过监听 mouseout 事件来实现。
安装
可以通过 npm 来安装 vue-away ：
npm install vue-away --save
然后在你的项目中，将 VueAway 注册为 Vue 组件。
使用
-- -------------------- ---- -------
----------
-----
--------- ------------------------------
---- -------------------
------------------- -- ------- -- ---
------
------
-----------
--------
------ ------- ---- ----------
------ ------- -
----------- -
--------
--
------ -
------ -
------------ ------
-------- --
-
--
-------- -
------------------- -
---------------- - ----
------------ - -------
--
--
-
---------在这个例子中，我们通过 @away 监听到了 vue-away 组件触发的 away 事件，并调用了 handleAway 方法做出响应。
你可以自定义离开页面后触发的方法，而不仅仅是显示一些消息。
配置
vue-away 可以接受一些参数来控制它的行为。以下是全部可用的参数：
distance：离开边界多少像素后触发事件，默认为 25 像素。throttle：事件触发的间隔时间，单位为毫秒，默认为 100 毫秒。
以下是一个例子，演示了如何自定义离开边界的距离：
-- -------------------- ---- -------
----------
-----
--------- -------------- ------------------------------
---- -------------------
------------------- -- ------- -- ---
------
------
-----------
--------
------ ------- ---- ----------
------ ------- -
----------- -
--------
--
------ -
------ -
------------ ------
-------- --
-
--
-------- -
------------------- -
---------------- - ----
------------ - -------
--
--
-
---------总结
vue-away 的强大在于它可以让你通过监听 mouseout 事件来实现一些需要鼠标离开页面时触发的操作。使用它非常方便，你只需要将它注册为 Vue 组件，并监听它触发的 away 事件即可。此外，你还可以通过传递不同的选项来自定义它的行为。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055e6c81e8991b448dbcf3