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 相关文章推荐
JavaScript 动态将数字金额转化为中文大写金额
May 14 Javascript
基于jquery的文章中所有图片width大小批量设置方法
Aug 01 Javascript
js Object2String方便查看js对象内容
Nov 24 Javascript
JavaScript对象之深度克隆介绍
Dec 08 Javascript
javascript中函数作为参数调用的方法
Feb 09 Javascript
javascript实现密码验证
Nov 10 Javascript
JavaScript中子对象访问父对象的方式详解
Sep 01 Javascript
JQuery Dialog对话框 不能通过Esc关闭的原因分析及解决办法
Jan 18 Javascript
微信小程序通过api接口将json数据展现到小程序示例
Jan 20 Javascript
Vue2.x中利用@font-size引入字体图标报错的解决方法
Sep 28 Javascript
JavaScript实现的3D旋转魔方动画效果实例代码
Jul 31 Javascript
JS sort方法基于数组对象属性值排序
Jul 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中var_dump方法的使用详解
2013/06/24 PHP
PHP中读取文件的几个方法总结(推荐)
2016/06/03 PHP
jQuery function的正确书写方法
2013/08/02 Javascript
Iframe实现跨浏览器自适应高度解决方法
2014/09/02 Javascript
Jquery 实现grid绑定模板
2015/01/28 Javascript
AngularJS快速入门
2015/04/02 Javascript
JS基于FileSystemObject创建一个指定路径的TXT文本文件
2015/08/05 Javascript
jQuery实现鼠标经过事件的延时处理效果
2020/08/20 Javascript
JavaScript基础篇(3)之Object、Function等引用类型
2015/11/30 Javascript
基于jQuery的Web上传插件Uploadify使用示例
2016/05/19 Javascript
使用Javascript监控前端相关数据的代码
2016/10/27 Javascript
jQuery加载及解析XML文件的方法实例分析
2017/01/22 Javascript
jQuery轻松实现无缝轮播效果
2017/03/22 jQuery
JavaScript实现隐藏省略文字效果的方法
2017/04/27 Javascript
关于JS与jQuery中的文档加载问题
2017/08/22 jQuery
Python中用Spark模块的使用教程
2015/04/13 Python
浅谈python 四种数值类型(int,long,float,complex)
2016/06/08 Python
linecache模块加载和缓存文件内容详解
2018/01/11 Python
Python装饰器的执行过程实例分析
2018/06/04 Python
Python画图实现同一结点多个柱状图的示例
2019/07/07 Python
多版本python的pip 升级后, pip2 pip3 与python版本失配解决方法
2019/09/11 Python
Python爬虫爬取Bilibili弹幕过程解析
2019/10/10 Python
使用jupyter Nodebook查看函数或方法的参数以及使用情况
2020/04/14 Python
python 利用opencv实现图像网络传输
2020/11/12 Python
浅析数据存储的三种方式 cookie sessionstorage localstorage 的异同
2020/06/04 HTML / CSS
意大利奢侈品综合电商网站:MODES
2019/12/14 全球购物
PHP如何防止SQL注入
2014/05/03 面试题
毕业生求职的求职信
2013/12/05 职场文书
省文明单位申报材料
2014/05/08 职场文书
食品安全标语
2014/06/07 职场文书
大学生第一学年自我鉴定2015
2014/09/28 职场文书
租房协议书范例
2014/10/14 职场文书
校本课程教学计划
2015/01/19 职场文书
挂职锻炼工作总结2015
2015/05/28 职场文书
2016年幼儿园万圣节活动总结
2016/04/05 职场文书
Vue.Draggable实现交换位置
2022/04/07 Vue.js