vue如何在用户要关闭当前网页时弹出提示的实现


Posted in Javascript onMay 31, 2020

本文介绍了vue如何在用户要关闭当前网页时弹出提示的实现,分享给大家,具体如下:

效果如下图

vue如何在用户要关闭当前网页时弹出提示的实现

正常 js 页面处理方式

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

vue 中处理方式

let _this = this
  window.onbeforeunload = function (e) {
   if (_this.$route.name == "dyyPerformanceCenterSale") {
    e = e || window.event;
    // 兼容IE8和Firefox 4之前的版本
    if (e) {
     e.returnValue = '关闭提示1111';
    }
    // Chrome, Safari, Firefox 4+, Opera 12+ , IE 9+
    return '关闭提示222';
   } else {
    window.onbeforeunload = null
   }
  };

针对很多同学说的没有实现 ,我这里在详细描述一下 方法写在 mounted里面 ,然后 记得把route name替换成自己当前页面的

到此这篇关于vue如何在用户要关闭当前网页时弹出提示的实现的文章就介绍到这了,更多相关vue关闭当前网页时弹出提示内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
JS实现浏览器菜单命令
Sep 05 Javascript
用javascript实现的图片马赛克后显示并切换加文字功能
Apr 21 Javascript
JQuery+JS实现仿百度搜索结果中关键字变色效果
Aug 02 Javascript
JavaScript实现信用卡校验方法
Apr 07 Javascript
js文本框走动跑马灯效果代码分享
Aug 25 Javascript
jquery可定制的在线UEditor编辑器
Nov 17 Javascript
JavaScript该如何学习 怎样轻松学习JavaScript
Jun 12 Javascript
JS中call和apply函数用法实例分析
Jun 20 Javascript
echarts实现折线图的拖拽效果
Dec 19 Javascript
Vue项目移动端滚动穿透问题的实现
May 19 Javascript
手把手教你如何编译打包video.js
Dec 09 Javascript
原生Js 实现的简单无缝滚动轮播图的示例代码
May 10 Javascript
使用原生JS实现滚轮翻页效果的示例代码
May 31 #Javascript
24个ES6方法解决JS实际开发问题(小结)
May 31 #Javascript
公众号SVG动画交互实战代码
May 31 #Javascript
微信小程序调用wx.getImageInfo遇到的坑解决
May 31 #Javascript
Vue-cli3生成的Vue项目加载Mxgraph方法示例
May 31 #Javascript
详解Typescript 内置的模块导入兼容方式
May 31 #Javascript
部署vue+Springboot前后端分离项目的步骤实现
May 31 #Javascript
You might like
PHP开发大型项目的一点经验
2006/10/09 PHP
一个简单的PHP&MYSQL留言板源码
2020/07/19 PHP
php header示例代码(推荐)
2010/09/08 PHP
如何利用PHP执行.SQL文件
2013/07/05 PHP
PHP如何通过date() 函数格式化显示时间
2020/11/13 PHP
Jquery 高亮显示文本中重要的关键字
2009/12/24 Javascript
一个基于jquery的图片切换效果
2010/07/06 Javascript
用js+iframe形成页面的一种遮罩效果的具体实现
2013/12/31 Javascript
javascript怎么禁用浏览器后退按钮
2014/03/27 Javascript
jQuery中:only-child选择器用法实例
2015/01/03 Javascript
jQuery循环动画与获取组件尺寸的方法
2015/02/02 Javascript
Jquery UI实现一次拖拽多个选中的元素操作
2020/12/01 Javascript
原生js实现弹出层效果
2017/01/20 Javascript
jquery实现数字输入框
2017/02/22 Javascript
微信小程序scroll-view实现横向滚动和上拉加载示例
2017/03/06 Javascript
JavaScript 数组去重并统计重复元素出现的次数实例
2017/12/14 Javascript
angular inputNumber指令输入框只能输入数字的实现
2019/12/03 Javascript
[00:35]DOTA2上海特级锦标赛 Newbee战队宣传片
2016/03/03 DOTA
python调用新浪微博API项目实践
2014/07/28 Python
Python中字典和JSON互转操作实例
2015/01/19 Python
python绘制中国大陆人口热力图
2018/11/07 Python
PyCharm鼠标右键不显示Run unittest的解决方法
2018/11/30 Python
vscode写python时的代码错误提醒和自动格式化的方法
2020/05/07 Python
使用Python文件读写,自定义分隔符(custom delimiter)
2020/07/05 Python
python切割图片的示例
2020/11/12 Python
CSS3 实现footer 固定在底部(无论页面多高始终在底部)
2019/10/15 HTML / CSS
CSS3实现缺角矩形,折角矩形以及缺角边框
2019/12/20 HTML / CSS
通过css3的filter滤镜改变png图片的颜色的示例代码
2020/05/06 HTML / CSS
比利时的在线灯具店:Lampen24.be
2019/07/01 全球购物
介绍一下linux文件系统分配策略
2012/11/17 面试题
大学生自荐书范文
2013/12/10 职场文书
执行总经理岗位职责
2014/02/03 职场文书
道路建设实施方案
2014/03/18 职场文书
2014年小学校长工作总结
2014/12/08 职场文书
检讨书范文500字
2015/01/28 职场文书
销售辞职信范文
2015/03/02 职场文书