[注]:  popstate 事件

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

  b.如果被激活的历史记录条目是通过对history.pushState()的调用创建的,或者受到对history.replaceState()的调用的影响,

popstate事件的state属性包含历史条目的状态对象的副本。

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

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

具体代码:

1. 配置路由 meta 的 keepAlive 属性 , 再App中 使用 keep-alive 标签 将当前页面加入缓存中

2.  打开弹窗调用 window.history.pishState() 函数

3. activated生命周期 监听popstate 事件 ,deactivated 生命周期 移除popstate事件

4. 配置事件监听函数

vue 弹窗时 监听手机返回键关闭弹窗(页面不跳转)的更多相关文章

  1. javascript监听手机返回键

    javascript监听手机返回键 <pre> if (window.history && window.history.pushState) { $(window).on ...

  2. 知识点---js监听手机返回键,回到指定界面

    方法一. $(function(){ pushHistory(); window.addEventListener(“popstate”, function(e) { window.location ...

  3. 使用ionic开发时用遇到监听手机返回按钮的问题~

    当时用的是ionic开发一个app,需求是,当按下手机的返回按钮,在指定的页面双击退出,而在其他页面点击一次返回到上个页面: 其实用ionic自带的服务就可以解决:  //双击退出   $ionicP ...

  4. vue 定义全局函数,监听android返回键事件

    vue 定义全局函数,监听android返回键事件 方法一:main.js 注入(1)在main.js中写入函数Vue.prototype.changeData = function (){ aler ...

  5. vue+hbuilder监听安卓返回键问题

    1.监听安卓返回键问题 效果:在一级页面按一下返回键提示退出应用,按两下退出应用;在其它页面中,按一下返回上个历史页面 1 2 import mui from './assets/js/mui.min ...

  6. 监听 手机back键和顶部的回退

    // 回退事件,监听 手机back键和顶部的回退 pushHistory(); window.addEventListener("popstate", function(e) { ...

  7. vue 移动端禁用安卓手机返回键

    //禁止手机返回键    下面这段代码直接复制在index.html中,可以生效// $(document).ready(function() { if (window.history &&a ...

  8. cordova app 监听物理返回键

    物理返回键指的是手机系统自带的返回按钮,通过cordova监听返回按钮操作,可以禁止某些页面的返回操作,以及实现点击两次返回按钮退出应用. var pageUrl = window.location. ...

  9. 监听浏览器返回键、后退、上一页事件(popstate)操作返回键

    在WebApp或浏览器中,会有点击返回.后退.上一页等按钮实现自己的关闭页面.调整到指定页面.确认离开页面或执行一些其它操作的需求.可以使用 popstate 事件进行监听返回.后退.上一页操作. 一 ...

随机推荐

  1. PHP学习(函数)

    可变函数,即通过变量的值来调用函数,因为变量的值是可变的,所以可以通过改变一个变量的值来实现调用不同的函数. 经常会用在回调函数.函数列表,或者根据动态参数来调用不同的函数.可变函数的调用方法为变量名 ...

  2. HZOI20190714 T3建造游乐场

    先放作者的正解: 先说g吧,有i个点的话,在其中i-1个点中有$C_{i-1}^{2}$种边,每个边有选和不选两种情况.如果度不是偶数呢?用剩下那个点给他连上呗.如果剩下那个点度数不是偶数呢?这是不可 ...

  3. 【JZOJ4784】【NOIP2016提高A组模拟9.15】Map

    题目描述 输入 输出 样例输入 4 4 2 1 2 2 3 3 2 3 4 1 2 1 4 样例输出 14 数据范围 样例解释 upd:保证原图连通. "不相交路径"的定义为不存在 ...

  4. TCP/IP 协议栈学习代码

    全部代码 直接使用socket 客户端 import java.io.*; import java.net.Inet4Address; import java.net.InetSocketAddres ...

  5. jquery鼠标悬停突出显示

    在线演示 本地下载

  6. oracle控制何时触发审计动作

    1)By session / By Access by session对每个session中发生的重复操作只记录一次 by access对每个session中发生的每次操作都记录,而不管是否重复. 对 ...

  7. RDS 5.7三节点企业版时代的数据一致性解决方案

    上篇我们看到了在MySQL主备模式下,我们在数据一致性上做了不少事情,但解决方案都有一定的局限性,适合部分场景或者解决不彻底的问题.随着以Google Spanner以及Amazon Aruora 为 ...

  8. 杨柳目-杨柳科-Info-新闻:注意了!杨絮解决有办法了

    ylbtech-杨柳目-杨柳科-Info-新闻:注意了!杨絮解决有办法了  1.返回顶部 1. 注意了!杨絮解决有办法了 2018-05-03 14:18 昨天中午经过一个理发店,门口蹲了个染黄发.系 ...

  9. 2019-10-22-win7-无法启动-WPF-程序-D3Dcompiler_47.dll-丢失

    title author date CreateTime categories win7 无法启动 WPF 程序 D3Dcompiler_47.dll 丢失 lindexi 2019-10-22 18 ...

  10. django之请求方法

    Http1.0定义了三种请求方法:GET,POST和HEAD方法 Http1.1新增了五种请求方式:OPTIONS,PUT,DELETE,TRACE和CONNECT方法 ----get        ...