vue浏览器返回监听
具体步骤如下:
1、挂载完成后,判断浏览器是否支持popstate
mounted(){
if (window.history && window.history.pushState) {
history.pushState(null, null, document.URL);
window.addEventListener('popstate', this.goBack, false);
}
},
2、页面销毁时,取消监听。否则其他vue路由页面也会被监听
destroyed(){
window.removeEventListener('popstate', this.goBack, false);
},
3、将监听操作写在methods里面,removeEventListener取消监听内容必须跟开启监听保持一致,所以函数拿到methods里面写
methods:{
goBack(){
//replace替换原路由,作用是避免回退死循环
this.$router.replace({path: '/mobileMtRoomList'});
}
}
vue浏览器返回监听的更多相关文章
- Activity中 左滑动返回监听
网易新闻中有个比较炫的效果,在QQ进入聊天界面也有这种效果,就是从界面左侧滑动到右侧时,界面退出,其实功能很容易实现: 1) Activity 去实现 implements OnTouchListen ...
- vue mounted中监听div的变化
vue mounted中监听div的变化 <div style="width:200px;height:30px;background: #0e90d2" id=" ...
- Vue之数据监听存在的问题
Vue之数据监听 当数据监听的是列表时,数据发生改变,不会被监听到. // 用$set修改数组中的数组能够被监听 // app.$set(this.hobby, 0, "爱你哦") ...
- Vue的watch监听事件
Vue的watch监听事件 相关Html: <!DOCTYPE html> <html lang="en"> <head> <meta c ...
- Vue watch 深层监听
Vue中监听某个对象的属性 为了避免监听整个对象导致效率问题,可以监听某个对象的特定属性 watch: { 'deptModel.depts': { handler(newVal, oldVal) { ...
- Vue之watch监听对象中某个属性的方法
新建 userinfo = { name: "小明", age: "18", } vue中watch监听name的方法 1. 可以结合计算属性的方法实现 { ...
- vue JS实现监听浏览器返回按键事件
// 这个是监听浏览器回退键的returnButton () { let vm = this; $(document).ready(function () { if (window.history & ...
- vue 弹窗时 监听手机返回键关闭弹窗(页面不跳转)
[注]: popstate 事件 a.当活动历史记录条目更改时,将触发popstate事件. b.如果被激活的历史记录条目是通过对history.pushState()的调用创建的,或者受到对his ...
- Vue.js:监听属性
ylbtech-Vue.js:监听属性 1.返回顶部 1. Vue.js 监听属性 本章节,我们将为大家介绍 Vue.js 监听属性 watch,我们可以通过 watch 来响应数据的变化: 实例 & ...
随机推荐
- 获取Json字符串中某个key对应的value
JSONObject jsonObj= JSONObject.fromObject(jsonStr); String value= jsonObj.getString(key);
- 分布式存储系统 Ceph
你了解Ceph吗? Ceph是一种分布式存储系统,它可以将多台服务器组成一个超大集群,把这些机器中的磁盘资源整合到一块儿,形成一个大的资源池(PB级别),然后按需分配给应用使用. 那么你知道Ceph的 ...
- Ubuntu14.04+caffe+cuda7.5 环境搭建以及MNIST数据集的训练与测试
Ubuntu14.04+caffe+cuda 环境搭建以及MNIST数据集的训练与测试 一.ubuntu14.04的安装: ubuntu的安装是一件十分简单的事情,这里给出一个参考教程: http:/ ...
- [原创]CSS 去掉点li 的点 使得LI前面的点不在显示
我对博客的认识是:记录问题,解决问题,分享知识.如果有轮子,我不需要造轮子. 1.问题解决方式: 设置属性:li {list-style-type:none;} 2.更多属性参数参考 list-sty ...
- springboot 监控
一.什么是spring-boot-starter-actuator(doc) springboot项目如何检查配置与运行状态呢?官方提供了一些接口可以查看springboot项目运行情况,只需要导入s ...
- Python3.x:将数据下载到xls时候用xml格式保存一份读取内容
Python3.x:将数据下载到xls时候用xml格式保存一份读取内容 核心代码: import json import xml.dom.minidom from urllib import requ ...
- git失败案例
哈哈哈,git终于能push了,哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈 我怀疑是系统版本的问题,之前一直不没能pu ...
- flex 的总结
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 事务的学习,从jdbc开始:jdbc对事务的支持与实现
在使用spring对项目进行开发时,所有的事务都是由spring来管理的.这样一来我们就可以不需要操心事务,可以专心的处理业务代码. 但是,事务的底层究竟是如何实现的呢?那就从jdbc开始学习. 在使 ...
- mybatis映射文件_select_resultMap
实体类: Employee.java类: package com.hand.mybatis.bean; public class Employee { private Integer e ...