vue项目中禁止移动设备的物理返回键

项目需求需要在某一页面禁掉移动设备的物理返回键，查阅了很多资料，给出的大同小异，基本上都是同一种方法

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

mounted(){
  // 如果支持 popstate 一般移动端都支持了
  if (window.history && window.history.pushState) {
    // 往历史记录里面添加一条新的当前页面的url
    history.pushState(null, null, document.URL);
    // 给 popstate 绑定一个方法 监听页面刷新
    window.addEventListener('popstate', this.goBack, false);//false阻止默认事件
  }
},

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

destroyed() {
			window.removeEventListener('popstate', this.goBack, false);//false阻止默认事件
			sessionStorage.setItem('isSign','1')
		}

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

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

这样写完之后你会发现是可以监听的到移动设备的物理返回键，但是尴尬的是只能监听到一次，如果你连续两次点击移动设备的物理返回键时，第一次禁止了，第二次却防不住，此时在goBack 里写  

history.pushState(null, null, document.URL);

之后你会神奇的发现，可以了！无论你点击物理返回键多少次，都是可以禁止掉的！