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 相关文章推荐
把jQuery的类、插件封装成seajs的模块的方法
Mar 12 Javascript
一款由jquery实现的整屏切换特效
Sep 15 Javascript
JS实现控制表格行内容垂直对齐的方法
Mar 30 Javascript
jQuery滚动加载图片实现原理
Dec 14 Javascript
js实现异步循环实现代码
Feb 16 Javascript
简单讲解jQuery中的子元素过滤选择器
Apr 18 Javascript
AngularJS $http模块POST请求实现
Apr 08 Javascript
JS+Canvas绘制动态时钟效果
Nov 10 Javascript
JavaScript检查数据中是否存在相同的元素(两种方法)
Oct 07 Javascript
vue 实现在同一界面实现组件的动态添加和删除功能
Jun 16 Javascript
详解JS ES6编码规范
May 07 Javascript
Vue Element plus使用方法梳理
Dec 24 Vue.js
使用原生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+iFrame实现页面无需刷新的异步文件上传
2014/09/16 PHP
Thinkphp 框架扩展之数据库驱动常用方法小结
2020/04/23 PHP
javascript cookie操作类的实现代码小结附使用方法
2010/06/02 Javascript
jquery 弹出层注册页面等(asp.net后台)
2010/06/17 Javascript
jQuery ajax BUG:object doesn't support this property or method
2010/07/06 Javascript
Jquery中Ajax 缓存带来的影响的解决方法
2011/05/19 Javascript
在子窗口中关闭父窗口的一句代码
2013/10/21 Javascript
JS中showModalDialog关闭子窗口刷新主窗口用法详解
2017/03/25 Javascript
微信小程序三级联动地址选择器的实例代码
2017/07/12 Javascript
Vue组件开发技巧总结
2018/03/04 Javascript
layerUI下的绑定事件实例代码
2018/08/17 Javascript
JS面向对象之多选框实现
2020/01/17 Javascript
vue项目中使用rem,在入口文件添加内容操作
2020/11/11 Javascript
django基于cors解决跨域请求问题详解
2019/08/06 Python
Python函数装饰器原理与用法详解
2019/08/16 Python
Tensorflow tf.dynamic_partition矩阵拆分示例(Python3)
2020/02/07 Python
如何使用Python发送HTML格式的邮件
2020/02/11 Python
css3 按钮样式简单可扩展创建
2013/03/18 HTML / CSS
纯CSS3大转盘抽奖示例代码(响应式、可配置)
2017/01/13 HTML / CSS
6PM官网:折扣鞋、服装及配饰
2018/08/03 全球购物
比利时的在线灯具店:Lampen24.be
2019/07/01 全球购物
Timberland法国官网:购买靴子、鞋子、衣服、夹克和配饰
2019/11/30 全球购物
实习生自荐信范文分享
2013/11/27 职场文书
汽车技术服务与营销专业推荐信
2013/11/29 职场文书
会计学自我鉴定
2014/02/06 职场文书
社区党务公开实施方案
2014/03/18 职场文书
六一儿童节演讲稿
2014/05/23 职场文书
小学三好学生事迹材料
2014/08/15 职场文书
2014年房地产工作总结范文
2014/11/19 职场文书
2015年保洁工作总结范文
2015/04/28 职场文书
廉洁自律承诺书范文
2015/04/28 职场文书
小学语文教学反思范文
2016/03/03 职场文书
加薪申请书应该这样写!
2019/07/04 职场文书
源码解读Spring-Integration执行过程
2021/06/11 Java/Android
Python中可变和不可变对象的深入讲解
2021/08/02 Python
JavaScript 事件捕获冒泡与捕获详情
2021/11/11 Javascript