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 相关文章推荐
用AJAX返回HTML片段中的JavaScript脚本
Jan 04 Javascript
浅析jQuery中常用的元素查找方法总结
Jul 04 Javascript
Javascript delete 引用类型对象
Nov 01 Javascript
多选列表框动态添加,移动,删除,全选等操作的简单实例
Jan 13 Javascript
jQuery实现点击水纹波动动画
Apr 10 Javascript
Bootstrap网格系统详解
Apr 26 Javascript
JS实现选定指定HTML元素对象中指定文本内容功能示例
Feb 13 Javascript
js仿淘宝商品放大预览功能
Mar 15 Javascript
Angular组件化管理实现方法分析
Mar 17 Javascript
使用Angular Cli如何创建Angular私有库详解
Jan 30 Javascript
layer.js之回调销毁对话框的例子
Sep 11 Javascript
详解JS WebSocket断开原因和心跳机制
May 07 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 快速排序算法详解
2014/11/10 PHP
Yii框架实现多数据库配置和操作的方法
2017/05/25 PHP
laravel实现批量更新多条记录的方法示例
2017/10/22 PHP
laravel5.1框架model类查询的实现方法
2019/10/08 PHP
asp.net下使用jquery 的ajax+WebService+json 实现无刷新取后台值的实现代码
2010/09/19 Javascript
jQuery boxy弹出层插件中文演示及使用讲解
2011/02/24 Javascript
event.X和event.clientX的区别分析
2011/10/06 Javascript
js实时获取系统当前时间实例代码
2013/06/28 Javascript
用js来获取上传的文件名纯粹是为了美化而用
2013/10/23 Javascript
js与运算符和或运算符的妙用
2014/02/14 Javascript
Javascript 浮点运算精度问题分析与解决
2014/03/26 Javascript
Nodejs学习笔记之NET模块
2015/01/13 NodeJs
使用JavaScript脚本无法直接改变Asp.net中Checkbox控件的Enable属性的解决方法
2015/09/16 Javascript
微信小程序搜索组件wxSearch实例详解
2017/06/08 Javascript
jQuery实现输入框的放大和缩小功能示例
2018/07/21 jQuery
JS实现根据指定值删除数组中的元素操作示例
2018/08/02 Javascript
基于Element封装一个表格组件tableList的使用方法
2020/06/29 Javascript
基于小程序请求接口wx.request封装的类axios请求
2020/07/02 Javascript
VUE实时监听元素距离顶部高度的操作
2020/07/29 Javascript
python中的对象拷贝示例 python引用传递
2014/01/23 Python
分享vim python缩进等一些配置
2018/07/02 Python
Python功能点实现:函数级/代码块级计时器
2019/01/02 Python
详解python opencv、scikit-image和PIL图像处理库比较
2019/12/26 Python
python编写一个会算账的脚本的示例代码
2020/06/02 Python
如何在keras中添加自己的优化器(如adam等)
2020/06/19 Python
纯CSS3实现带动画效果导航菜单无需js
2013/09/27 HTML / CSS
荷兰和比利时时尚鞋店:Van Dalen
2018/04/23 全球购物
年终总结会主持词
2014/03/25 职场文书
思想纪律作风整顿剖析材料
2014/10/11 职场文书
硕士学位论文评语
2014/12/31 职场文书
2015学习委员工作总结范文
2015/04/03 职场文书
银行稽核岗位职责
2015/04/13 职场文书
入党介绍人意见2015
2015/06/01 职场文书
毕业证明书
2015/06/19 职场文书
Python经常使用的一些内置函数
2022/04/11 Python
pandas时间序列之pd.to_datetime()的实现
2022/06/16 Python