vue 弹窗时 监听手机返回键关闭弹窗功能(页面不跳转)


Posted in Javascript onMay 10, 2019

[注]:popstate 事件

a.当活动历史记录条目更改时,将触发popstate事件。

b.如果被激活的历史记录条目是通过对history.pushState()的调用创建的,或者受到对history.replaceState()的调用的影响,popstate事件的state属性包含历史条目的状态对象的副本。

c.需要注意的是调用history.pushState()history.replaceState()不会触发popstate事件。

d.只有在做出浏览器动作时,才会触发该事件,如用户点击浏览器的回退按钮(或者在Javascript代码中调用history.back()

具体代码:

1.弹窗事件中调用

vue 弹窗时 监听手机返回键关闭弹窗功能(页面不跳转)

2. mounted 生命周期 监听popstate 事件

vue 弹窗时 监听手机返回键关闭弹窗功能(页面不跳转)

3.beforeDestroy 生命周期 移除popstate 事件

vue 弹窗时 监听手机返回键关闭弹窗功能(页面不跳转)

总结

以上所述是小编给大家介绍的vue 弹窗时 监听手机返回键关闭弹窗功能(页面不跳转),希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

Javascript 相关文章推荐
实现网页页面跳转的几种方法(meta标签、js实现、php实现)
May 20 Javascript
一个简单的全屏图片上下打开显示网页效果示例
Jul 08 Javascript
详解jquery中$.ajax方法提交表单
Nov 03 Javascript
javascript中attachEvent用法实例分析
May 14 Javascript
jQuery匹配文档链接并添加class的方法
Jun 26 Javascript
JS中如何比较两个Json对象是否相等实例代码
Jul 13 Javascript
Bootstrap复选框和单选按钮美化插件(推荐)
Nov 23 Javascript
axios基本入门用法教程
Mar 25 Javascript
React-Native中props具体使用详解
Sep 04 Javascript
基于Datatables跳转到指定页的简单实例
Nov 09 Javascript
vue中选项卡点击切换且能滑动切换功能的实现代码
Nov 25 Javascript
微信小程序实现拖拽功能
Sep 26 Javascript
vue-cli+axios实现文件上传下载功能(下载接收后台返回文件流)
May 10 #Javascript
vue element中axios下载文件(后端Python)
May 10 #Javascript
微信小程序授权登录解决方案的代码实例(含未通过授权解决方案)
May 10 #Javascript
简单通过settimeout看javascript的运行机制
May 10 #Javascript
详解js实时获取并显示当前时间的方法
May 10 #Javascript
JS获取本地地址及天气的方法实例小结
May 10 #Javascript
Vue keepAlive 数据缓存工具实现返回上一个页面浏览的位置
May 10 #Javascript
You might like
使用PHP备份MYSQL数据的多种方法
2014/01/15 PHP
PHP四种基本排序算法示例
2015/04/09 PHP
调试Node.JS的辅助工具(NodeWatcher)
2012/01/04 Javascript
JS根据生日算年龄的方法
2015/05/05 Javascript
JQuery实现超链接鼠标提示效果的方法
2015/06/10 Javascript
Bootstrap页面布局基础知识全面解析
2016/06/13 Javascript
AngularJS实现树形结构(ztree)菜单示例代码
2016/09/18 Javascript
Node.js 异步异常的处理与domain模块解析
2017/05/10 Javascript
nodejs基础之buffer缓冲区用法分析
2018/12/26 NodeJs
[36:33]完美世界DOTA2联赛PWL S2 LBZS vs Forest 第二场 11.29
2020/12/02 DOTA
python使用循环实现批量创建文件夹示例
2014/03/25 Python
使用python开发vim插件及心得分享
2014/11/04 Python
Python中list列表的一些进阶使用方法介绍
2015/08/15 Python
Python设计模式编程中Adapter适配器模式的使用实例
2016/03/02 Python
详解Python实现按任意键继续/退出的功能
2016/08/19 Python
对numpy数据写入文件的方法讲解
2018/07/09 Python
对python多线程SSH登录并发脚本详解
2019/02/14 Python
pandas的qcut()方法详解
2019/07/06 Python
python多线程+代理池爬取天天基金网、股票数据过程解析
2019/08/13 Python
Python socket非阻塞模块应用示例
2019/09/12 Python
使用Python给头像加上圣诞帽或圣诞老人小图标附源码
2019/12/25 Python
python 日志 logging模块详细解析
2020/03/31 Python
python将logging模块封装成单独模块并实现动态切换Level方式
2020/05/12 Python
CSS3中的弹性布局em运用入门详解 1em等于多少像素
2021/02/08 HTML / CSS
Alba Moda瑞士网上商店:独家意大利时尚女装销售
2016/11/28 全球购物
英国最大的割草机购买网站:Just Lawnmowers
2019/11/02 全球购物
为什么使用接口?
2014/08/13 面试题
关于Assembly命名空间的三个面试题
2015/07/23 面试题
技术副厂长岗位职责
2013/12/26 职场文书
生产车间班组长岗位职责
2014/01/06 职场文书
运动会通讯稿150字
2014/02/15 职场文书
学习全国两会精神心得体会范文
2014/03/17 职场文书
学习计划是什么
2019/04/30 职场文书
手把手教你制定暑期学习计划,让你度过充实的暑假
2019/08/22 职场文书
python之np.argmax()及对axis=0或者1的理解
2021/06/02 Python
解决Maven项目中 Invalid bound statement 无效的绑定问题
2021/06/15 Java/Android