1、挂载完成后,判断浏览器是否支持popstate
mounted(){
if (window.history && window.history.pushState) {
history.pushState(null, null, document.URL);
window.addEventListener('popstate', this.goBack, false);
}
},
2、页面销毁时,取消监听。否则其他vue路由页面也会被监听 但是destroyed可能会无效,所以最后在beforeDestroy
中也执行一下销毁
destroyed(){
window.removeEventListener('popstate', this.goBack, false);
}
3、将监听操作写在methods里面,removeEventListener
取消监听内容必须跟开启监听保持一致,所以函数拿到methods
里面写
methods:{
goBack(){
this.$router.replace({path: '/'});
//replace替换原路由,作用是避免回退死循环
}
}
追梦猪在使用此来实现手机h5微信支付的时候为了用户更好的体验让用户点击完成触发返回可以不在回到上一层而是我们指定的页面所以监听了返回键但是跟原先的写法返回有了一个冲突,原先go(-3)返回变成go(-4)才能返回到指定的页面,所以在用户体验的道路上任重道远啊!
本文地址:https://www.zhuimengzhu.com/details/275.html
转载地址:暂无
转载说明:转载时请在文首注明来源zhuimengzhu.com 及教程作者,并附本文链接。谢谢各位编辑同仁配合。zhuimengzhu 保留追究相应责任的权利。