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中的mouseleave和mouseout的区别 模仿下拉框效果
Feb 07 Javascript
javascript的document中的动态添加标签实现方法
Oct 24 Javascript
sea.js常用的api简易文档
Nov 15 Javascript
JavaScript数据结构之数组的表示方法示例
Apr 12 Javascript
node.js操作mongodb简单示例分享
May 25 Javascript
vue双花括号的使用方法 附练习题
Nov 07 Javascript
vue+axios新手实践实现登陆的示例代码
Jun 06 Javascript
详解如何使用node.js的开发框架express创建一个web应用
Dec 20 Javascript
jQuery 动态粒子效果示例代码
Jul 07 jQuery
使用JavaScript和MQTT开发物联网应用示例解析
Aug 07 Javascript
OpenLayers3实现对地图的基本操作
Sep 28 Javascript
vantUI 获得piker选中值的自定义ID操作
Nov 04 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
一个oracle+PHP的查询的例子
2006/10/09 PHP
php将数据库中的电话号码读取出来并生成图片
2008/08/31 PHP
解析获取优酷视频真实下载地址的PHP源代码
2013/06/26 PHP
php不允许用户提交空表单(php空值判断)
2013/11/12 PHP
php实现发送微信模板消息的方法
2015/03/07 PHP
全面解读PHP的Yii框架中的日志功能
2016/03/17 PHP
php 根据自增id创建唯一编号类
2017/04/06 PHP
Yii2框架自定义类统一处理url操作示例
2019/05/25 PHP
PHP二维数组分页2种实现方法解析
2020/07/09 PHP
jquery获取下拉列表的值为null的解决方法
2011/03/18 Javascript
js去空格技巧分别去字符串前后、左右空格
2013/10/21 Javascript
js实现的简洁网页滑动tab菜单效果代码
2015/08/24 Javascript
jQuery插件zTree实现获取当前选中节点在同级节点中序号的方法
2017/03/08 Javascript
原生JS实现左右箭头选择日期实例代码
2017/03/14 Javascript
Jquery中attr与prop的区别详解
2017/05/27 jQuery
详解node.js 下载图片的 2 种方式
2018/03/02 Javascript
Vue使用vue-area-linkage实现地址三级联动效果的示例
2018/06/27 Javascript
基于Vue 2.0 监听文本框内容变化及ref的使用说明介绍
2018/08/24 Javascript
nodejs aes 加解密实例
2018/10/10 NodeJs
JavaScript学习笔记之基于定时器实现图片无缝滚动功能详解
2019/01/09 Javascript
vue的keep-alive中使用EventBus的方法
2019/04/23 Javascript
解决cordova+vue 项目打包成APK应用遇到的问题
2019/05/10 Javascript
js 根据对象数组中的属性进行排序实现代码
2019/09/12 Javascript
Python3 利用requests 库进行post携带账号密码请求数据的方法
2018/10/26 Python
Python转换字典成为对象,可以用"."方式访问对象属性实例
2020/05/11 Python
Python selenium使用autoIT上传附件过程详解
2020/05/26 Python
html5的input的required使用中遇到的问题及解决方法
2018/04/24 HTML / CSS
布里斯班女装时尚品牌:Adrift
2017/12/28 全球购物
JD Sports荷兰:英国领先的运动时尚零售商
2020/03/13 全球购物
Cecil Mode法国在线商店:女性时尚
2021/01/08 全球购物
试解释COMMIT操作和ROLLBACK操作的语义
2014/07/25 面试题
家居设计专业个人自荐信范文
2013/11/26 职场文书
护士长竞聘书
2014/03/31 职场文书
西安事变观后感
2015/06/12 职场文书
一文搞懂php的垃圾回收机制
2021/06/18 PHP
Golang使用Panic与Recover进行错误捕获
2022/03/22 Golang