js监听离开当前页面

最近公司vue项目中有一个需求，需要在当前页面刷新或跳转时提示保存并可取消刷新，以防止填写的表单内容丢失。刚开始思考觉得很简单，直接在Router的钩子中判断就好了，但是会发现还有新的问题存在，浏览器刷新和当前页面关闭的时候无法监听，最终用window.onbeforeunlo…

首先说一个h5事件 visibilitychange visibilitychange是浏览器新添加的一个事件 当浏览器当前页面被最小化 或者切换到浏览器的其

今天是我坚持日更的第十六天，在这十六天里，也许写的博客比较简单基础，但是每一篇文章都是当天一字一句敲出来的，题材也是当天想的，没有存稿，也没有文思泉涌，更多的是逼着自己做这件事情罢了......

考察点 其实这考查的是html5中一个新的事件——visibilitychange，当用户进入页面或者离开页面时，都会触发该事件与此同时，在document对象上也新增了一个属性 visibility

搞了大半天，都没有很理想的方法，只能凑合着用了 我使用的是beforeunload事件，他的bug就是需要用户去进行一些交互动作，比如点击、滑动，如果用户直接返回，那么beforeunload是不会触

VUE监听当前显示页面切走和移回安装依赖$ npm i vue-visibility-change -Smain.js引用import visibility from 'vue-visibility-

监听有方法要放在主页面中，不能放在组件中，切记，监听页面滚动到底部放回true，发请求获取新数据，监听页面滚动距离返回值，滚动一定距离后显示吸顶组件 在src中的hooks文件夹下创建useScrol

为什么要写这个文章，因为每个礼拜都有人问我这个问题... 离开页面方式，被location.href,a标签,关闭浏览器或者当前tab页等... 首先要知道一个事件:onbeforeunload,MDN的说明是：当浏览器窗口关闭或者刷新时，会触发beforeunload事件。当…

定义 onbeforeunload事件在onunload事件之前触发。 调用方式 MDN官方示例： 或者在body标签上绑定onbeforeunload，但更推荐使用addEventListener的