具体步骤如下:

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浏览器返回监听的更多相关文章

  1. Activity中 左滑动返回监听

    网易新闻中有个比较炫的效果,在QQ进入聊天界面也有这种效果,就是从界面左侧滑动到右侧时,界面退出,其实功能很容易实现: 1) Activity 去实现 implements OnTouchListen ...

  2. vue mounted中监听div的变化

    vue mounted中监听div的变化 <div style="width:200px;height:30px;background: #0e90d2" id=" ...

  3. Vue之数据监听存在的问题

    Vue之数据监听 当数据监听的是列表时,数据发生改变,不会被监听到. // 用$set修改数组中的数组能够被监听 // app.$set(this.hobby, 0, "爱你哦") ...

  4. Vue的watch监听事件

    Vue的watch监听事件 相关Html: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  5. Vue watch 深层监听

    Vue中监听某个对象的属性 为了避免监听整个对象导致效率问题,可以监听某个对象的特定属性 watch: { 'deptModel.depts': { handler(newVal, oldVal) { ...

  6. Vue之watch监听对象中某个属性的方法

    新建 userinfo = { name: "小明",  age: "18", } vue中watch监听name的方法 1. 可以结合计算属性的方法实现 { ...

  7. vue JS实现监听浏览器返回按键事件

    // 这个是监听浏览器回退键的returnButton () { let vm = this; $(document).ready(function () { if (window.history & ...

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

    [注]:  popstate 事件 a.当活动历史记录条目更改时,将触发popstate事件. b.如果被激活的历史记录条目是通过对history.pushState()的调用创建的,或者受到对his ...

  9. Vue.js:监听属性

    ylbtech-Vue.js:监听属性 1.返回顶部 1. Vue.js 监听属性 本章节,我们将为大家介绍 Vue.js 监听属性 watch,我们可以通过 watch 来响应数据的变化: 实例 & ...

随机推荐

  1. Java程序运行在Docker等容器环境有哪些新问题

    基本回答 一.  对于Java来说,Docker毕竟是一个较新的环境,其内存.CPU等资源限制是通过ControlGroup实现的.早期的JDK版本并不能识别这些限制,进而会导致一些基础问题. 1.如 ...

  2. spring + groovy 转

    http://www.ibm.com/developerworks/cn/java/j-groovierspring2.html http://blog.csdn.net/qq362228416/ar ...

  3. linux 自启动方法

    参考文章:http://vod.sjtu.edu.cn/help/Article_Print.asp?ArticleID=626 http://hiandroidstudio.blog.51cto.c ...

  4. PHP引入框架包

    引入包 之后 在写代码的时候会有提示. 流程: 项目名称右击->包含目录->TAB页签选择库-> add external source folder 找到需要的包.

  5. # 20145103《Java程序设计》第6周学习总结

    20145103<Java程序设计>第6周学习总结 教材学习内容总结 第十章 第十章输入和输出 10.1.1 ·若要将数据从来源中取出,可以使用输入串流:若要将数据写入目的地,可以使用输出 ...

  6. 在Linux终端管理文件你要知道的11个命令

    LS - 列表文件 ls命令列出目录中的文件. 默认情况下,使用ls列出当前目录下的文件. 2 你也可以列出文件递归-也就是说,列出所有文件在当前目录中的目录-使用ls -R.LS还可以列出在其他目录 ...

  7. Linux命令awk

    1.简介 awk是一个强大的文本分析工具,相对于grep的查找,sed的编辑,awk在其对数据分析并生成报告时,显得尤为强大. 简单来说awk就是把文件逐行读入,默认以空格为分隔符将每行切片,切开的部 ...

  8. python-集合、字典

    文件操作: open() read() readline() readlines() write() writelines() flush()   #刷新缓冲区 seek()   修改文件读写指针 t ...

  9. TortoiseSVN忽略文件夹

    因为平时要做一些主干.分支的版本控制,发布增量补丁包工作,所以经常使用TortoiseSVN客户端.当然,eclipse中也安装了SVN插件,不过在打补丁方面感觉不如客户端.现在遇到了一个问题:同一项 ...

  10. 提高ubuntu系统性能的小技巧

    在UBUNTU系统里面,并不是你的物理内存全部耗尽之后,系统才使用swap分区!系统的swappiness设定值,对如何使用swap分区是有着很大的联系,并不是当swappiness=0的时候就不使用 ...