运维开发网

vue-app物理返回键跳到指定页面

运维开发网 https://www.qedev.com 2020-07-23 17:03 出处:网络 作者:运维开发网整理
例如提交订单成功跳到了订单详情页面,再返回就又到了提交订单支付页面 我们需要返回到其他页面   1、挂载完成后,判断浏览器是否支持popstate mounted(){ if (window.history && window.history.pushState) { history.pushState(null, null, document.URL); window.

例如提交订单成功跳到了订单详情页面,再返回就又到了提交订单支付页面

我们需要返回到其他页面

 

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(){
    this.$router.replace({path: ‘/‘});
    //replace替换原路由,作用是避免回退死循环
  }
}
0

上一篇:

:下一篇

精彩评论

暂无评论...
验证码 换一张
取 消