vue项目中监听手机物理返回键

需要监听手机的回退按钮。

1、挂载完成后,判断浏览器是否支持popstate

mounted(){
  if (window.history && window.history.pushState) {
    history.pushState(null, null, document.URL);
    window.addEventListener('popstate', this.fun, false);//false阻止默认事件
  }
}

2、页面销毁时,取消监听。否则其他vue路由页面也会被监听

destroyed(){
  window.removeEventListener('popstate', this.fun, false);//false阻止默认事件
}

3、将监听操作写在methods里面,removeEventListener取消监听内容必须跟开启监听保持一致,所以函数拿到methods里面写

methods:{
  fun(){
    console.log("监听到了");
  }
}

猜你喜欢

转载自blog.csdn.net/unbreakablec/article/details/90269710