关于vue.js:vue项目阻止浏览器后退操作

5次阅读

共计 834 个字符，预计需要花费 3 分钟才能阅读完成。

参数
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
  }
}

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

正文完