vuejs中监听窗口关闭和窗口刷新事件的方法


Posted in Javascript onSeptember 21, 2018

1、使用window.onunload之类的API

window.onbeforeunload = function (e) {
 e = e || window.event;
 
 // 兼容IE8和Firefox 4之前的版本
 if (e) {
 e.returnValue = '关闭提示';
 }
 
 // Chrome, Safari, Firefox 4+, Opera 12+ , IE 9+
 return '关闭提示';
};

2、在生命周期钩子中注册监听事件

methods: {
 beforeunloadHandler (e) {
 // ...
 }
}

在 mounted 钩子中注册事件

mounted() {
 window.addEventListener('beforeunload', e => this.beforeunloadHandler(e))
}

在 destroyed 钩子卸载事件

destroyed() {
 window.removeEventListener('beforeunload', e => this.beforeunloadHandler(e))
}

以上这篇vuejs中监听窗口关闭和窗口刷新事件的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JQUERY 对象与DOM对象之两者相互间的转换
Apr 27 Javascript
分享27款非常棒的jQuery 表单插件
Mar 28 Javascript
jquery实现全选功能效果的实现代码
May 05 Javascript
vue快捷键与基础指令详解
Jun 01 Javascript
input file样式修改以及图片预览删除功能详细概括(推荐)
Aug 17 Javascript
基于匀速运动的实例讲解(侧边栏,淡入淡出)
Oct 17 Javascript
vuex 使用文档小结篇
Jan 11 Javascript
搭建element-ui的Vue前端工程操作实例
Feb 23 Javascript
详解基于DllPlugin和DllReferencePlugin的webpack构建优化
Jun 28 Javascript
微信小程序url传参写变量的方法
Aug 09 Javascript
深入解析koa之异步回调处理
Jun 17 Javascript
vue实现select下拉显示隐藏功能
Sep 30 Javascript
vue集成百度UEditor富文本编辑器使用教程
Sep 21 #Javascript
JavaScript 2018 中即将迎来的新功能
Sep 21 #Javascript
vue 弹框产生的滚动穿透问题的解决
Sep 21 #Javascript
vue-quill-editor富文本编辑器简单使用方法
Sep 21 #Javascript
探秘vue-rx 2.0(推荐)
Sep 21 #Javascript
Vue-Quill-Editor富文本编辑器的使用教程
Sep 21 #Javascript
vue+axios实现文件下载及vue中使用axios的实例
Sep 21 #Javascript
You might like
php二维数组转成字符串示例
2014/02/17 PHP
php过滤html中的其他网站链接的方法(域名白名单功能)
2014/04/24 PHP
php验证session无效的解决方法
2014/11/04 PHP
PHP封装的多文件上传类实例与用法详解
2017/02/07 PHP
PHP实现登录验证码校验功能
2018/05/17 PHP
js静态作用域的功能。
2006/12/25 Javascript
js 兼容多浏览器的回车和鼠标焦点事件代码(IE6/7/8,firefox,chrome)
2010/04/14 Javascript
详解JS 比较两个Json对象的值是否相等的实例
2013/11/20 Javascript
jQuery获得内容和属性示例代码
2014/01/16 Javascript
动态的创建一个元素createElement及删除一个元素
2014/01/24 Javascript
NodeJS学习笔记之MongoDB模块
2015/01/13 NodeJs
jQuery中on()方法用法实例
2015/01/19 Javascript
Jquery实现遮罩层的简单实例(就是弹出DIV周围都灰色不能操作)
2016/07/14 Javascript
微信小程序 九宫格实例代码
2017/01/21 Javascript
JS判断非空至少输入两个字符的简单实现方法
2017/06/23 Javascript
vue文件运行的方法教学
2019/02/12 Javascript
浅谈Node新版本13.2.0正式支持ES Modules特性
2019/11/25 Javascript
解决echarts 一条柱状图显示两个值,类似进度条的问题
2020/07/20 Javascript
Python实现读取并保存文件的类
2017/05/11 Python
python分块读取大数据,避免内存不足的方法
2018/12/10 Python
在python中获取div的文本内容并和想定结果进行对比详解
2019/01/02 Python
浅谈pyqt5在QMainWindow中布局的问题
2019/06/21 Python
Python如何将将模块分割成多个文件
2020/08/04 Python
Python实现对word文档添加密码去除密码的示例代码
2020/12/29 Python
HTML5单页面手势滑屏切换原理分析
2017/07/10 HTML / CSS
中软Java笔试题
2012/11/11 面试题
linux比较文件内容的命令是什么
2015/09/23 面试题
计算机本科生自荐信
2013/10/15 职场文书
翻译学院毕业生自荐书
2014/02/02 职场文书
阳光体育活动方案
2014/02/16 职场文书
期末评语大全
2014/05/04 职场文书
企业承诺书格式范文
2015/04/28 职场文书
母亲节主题班会
2015/08/14 职场文书
怎样写工作总结啊!
2019/06/18 职场文书
《我在为谁工作》:工作的质量往往决定生活的质量
2019/12/27 职场文书
JavaScript实现登录窗体
2021/06/22 Javascript