vue项目阻止浏览器后退操作

使用history.pushState(state, title, url)方法

参数
state

状态对象是一个JavaScript对象，它与pushState()创建的新历史记录条目相关联。 每当用户导航到新状态时，都会触发popstate (en-US)事件，并且该事件的状态属性包含历史记录条目的状态对象的副本。
状态对象可以是任何可以序列化的对象。 因为Firefox将状态对象保存到用户的磁盘上，以便用户重新启动浏览器后可以将其还原，所以我们对状态对象的序列化表示施加了640k个字符的大小限制。 如果将序列化表示形式大于此状态的状态对象传递给pushState()，则该方法将引发异常。 如果您需要更多空间，建议您使用 sessionStorage或者localStorage。

title

当前大多数浏览器都忽略此参数，尽管将来可能会使用它。 在此处传递空字符串应该可以防止将来对方法的更改。 或者，您可以为要移动的状态传递简短的标题。

url 可选

新历史记录条目的URL由此参数指定。 请注意，浏览器不会在调用pushState() 之后尝试加载此URL，但可能会稍后尝试加载URL，例如在用户重新启动浏览器之后。 新的URL不必是绝对的。 如果是相对的，则相对于当前URL进行解析。 新网址必须与当前网址相同 origin； 否则，pushState()将引发异常。 如果未指定此参数，则将其设置为文档的当前URL。

结合vue-router钩子函数，将url设定为当前页面的url。

我自己在实战中的代码：

beforeRouteUpdate(to,from,next){
  //判断是不是点击的后退按钮 ,当点击后退按钮的时候当前url和to.fullPath 一样
  if((location.pathname+location.search)==to.from.fullPath){
     history.pushState(null,null,location.href);
     return
  }
}

完结！
欢迎指教，虚心好学！