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 相关文章推荐
根据分辨率不同,调用不同的css文件
Jul 07 Javascript
基于jquery的超简单上下翻
Apr 20 Javascript
Prototype源码浅析 String部分(二)
Jan 16 Javascript
jquery $.trim()去除字符串空格的实现方法【附图例】
Mar 30 Javascript
ES6中的数组扩展方法
Aug 26 Javascript
JS获取本周周一,周末及获取任意时间的周一周末功能示例
Feb 09 Javascript
基于js中document.cookie全面解析
Sep 14 Javascript
JS简单添加元素新节点的方法示例
Feb 10 Javascript
Vue 用Vant实现时间选择器的示例代码
Oct 25 Javascript
JS实现的定时器展示简单秒表、页面弹框及跳转操作完整示例
Jan 26 Javascript
JSONP解决JS跨域问题的实现
May 25 Javascript
JavaScript中MutationObServer监听DOM元素详情
Nov 27 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 中的批处理的实现
2007/06/14 PHP
PHP遍历数组的方法汇总
2015/04/30 PHP
解决出现SoapFault (looks like we got no XML document)的问题
2017/06/24 PHP
thinkphp 5框架实现登陆,登出及session登陆状态检测功能示例
2019/10/10 PHP
javascript基础的动画教程,直观易懂
2007/01/10 Javascript
javascript之更有效率的字符串替换
2008/08/02 Javascript
select组合框option的捕捉实例代码
2008/09/30 Javascript
把html页面的部分内容保存成新的html文件的jquery代码
2009/11/12 Javascript
js 对联广告、漂浮广告封装类(IE,FF,Opera,Safari,Chrome
2009/11/26 Javascript
Json对象替换字符串占位符实现代码
2010/11/17 Javascript
js实现带圆角的两级导航菜单效果代码
2015/08/24 Javascript
JS实现的仿淘宝交易倒计时效果
2015/11/27 Javascript
javascript中的 object 和 function小结
2016/08/14 Javascript
微信小程序 定义全局数据、函数复用、模版等详细介绍
2016/10/27 Javascript
基于JavaScript实现窗口拖动效果
2017/01/18 Javascript
Angular实现下载安装包的功能代码分享
2017/09/05 Javascript
Next.js项目实战踩坑指南(笔记)
2018/11/29 Javascript
详解微信小程序开发聊天室—实时聊天,支持图片预览
2019/05/20 Javascript
vue实现在线学生录入系统
2020/05/30 Javascript
[50:17]Newbee vs Serenity 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
Python生成验证码、计算具体日期是一年中的第几天实例代码详解
2019/10/16 Python
Python pandas RFM模型应用实例详解
2019/11/20 Python
解决Alexnet训练模型在每个epoch中准确率和loss都会一升一降问题
2020/06/17 Python
使用css3 属性如何丰富图片样式(圆角 阴影 渐变)
2012/11/22 HTML / CSS
修理厂厂长岗位职责
2014/01/30 职场文书
电大毕业个人生自我鉴定
2014/03/26 职场文书
《故乡》教学反思
2014/04/10 职场文书
一帮一活动总结
2014/05/08 职场文书
民生工作实施方案
2014/05/31 职场文书
幼师求职信
2014/06/23 职场文书
综治维稳工作承诺书
2014/08/30 职场文书
教师节晚会主持词
2015/06/30 职场文书
公司费用报销管理制度
2015/08/04 职场文书
MySQL获取所有分类的前N条记录
2021/05/07 MySQL
使用GO语言实现Mysql数据库CURD的简单示例
2021/08/07 Golang
聊聊Python String型列表求最值的问题
2022/01/18 Python