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的弹出警告对话框美化插件(警告,确认和提示)
Jun 10 Javascript
DIY jquery plugin - tabs标签切换实现代码
Dec 11 Javascript
用js控制组织结构图可以任意拖拽到指定位置
Jan 17 Javascript
jquery实现LED广告牌旋转系统图片切换效果代码分享
Aug 26 Javascript
使用JQuery FancyBox插件实现图片展示特效
Nov 16 Javascript
Bootstrap项目实战之首页内容介绍(全)
Apr 25 Javascript
原生js仿jquery一些常用方法(必看篇)
Sep 20 Javascript
几句话带你理解JS中的this、闭包、原型链
Sep 26 Javascript
使用vue-cli(vue脚手架)快速搭建项目的方法
May 21 Javascript
node.js实现微信开发之获取用户授权
Mar 18 Javascript
uploadify插件实现多个图片上传并预览
Sep 30 Javascript
Ant Design的Table组件去除
Oct 24 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生成随机密码的几种方法
2011/01/17 PHP
PHP中CURL的CURLOPT_POSTFIELDS参数使用细节
2014/03/17 PHP
php微信公众平台开发(三)订阅事件处理
2016/12/06 PHP
PHP使Laravel为JSON REST API返回自定义错误的问题
2018/10/16 PHP
JavaScript面向对象知识串结(读JavaScript高级程序设计(第三版))
2012/07/17 Javascript
js简单实现让文本框内容逐个字的显示出来
2013/10/22 Javascript
location.href用法总结(最主要的)
2013/12/27 Javascript
使用jQuery实现的掷色子游戏动画效果
2014/03/14 Javascript
javascript学习笔记(四)function函数部分
2014/09/30 Javascript
js类式继承与原型式继承详解
2016/04/07 Javascript
vue.js中$set与数组更新方法
2018/03/08 Javascript
常用的 JS 排序算法 整理版
2018/04/05 Javascript
Vue验证码60秒倒计时功能简单实例代码
2018/06/22 Javascript
js实现延迟加载的几种方法详解
2019/01/19 Javascript
基于vue写一个全局Message组件的实现
2019/08/15 Javascript
Angular value与ngValue区别详解
2019/11/27 Javascript
jQuery实现可编辑的表格
2019/12/11 jQuery
vue中使用elementUI组件手动上传图片功能
2019/12/13 Javascript
[08:54]《一刀刀一天》之DOTA全时刻18:十九支奔赴西雅图队伍全部出炉
2014/06/04 DOTA
python通过ElementTree操作XML获取结点读取属性美化XML
2013/12/02 Python
pygame学习笔记(1):矩形、圆型画图实例
2015/04/15 Python
python在指定目录下查找gif文件的方法
2015/05/04 Python
python实现求解列表中元素的排列和组合问题
2018/03/15 Python
如何用python整理附件
2018/05/13 Python
python读写LMDB文件的方法
2018/07/02 Python
Python视频编辑库MoviePy的使用
2020/04/01 Python
Python实现一个简单的毕业生信息管理系统的示例代码
2020/06/08 Python
H5仿微信界面教程(一)
2017/07/05 HTML / CSS
Blue Nile台湾:钻石珠宝商,订婚首饰、结婚戒指和精品首饰
2017/11/24 全球购物
荷兰家电销售网站:Welhof
2020/12/08 全球购物
计生办班子群众路线教育实践活动个人对照检查材料思想汇报
2014/10/04 职场文书
工伤死亡理赔协议书
2014/10/20 职场文书
十个Python自动化常用操作,即拿即用
2021/05/10 Python
使用 Apache Superset 可视化 ClickHouse 数据的两种方法
2021/07/07 Servers
实战 快速定位MySQL的慢SQL
2022/03/22 MySQL
Python软件包安装的三种常见方法
2022/07/07 Python