vue页面监听,vue 浏览器返回

　　本文主要介绍vue浏览器返回监控的具体步骤。通过示例代码进行了非常详细的介绍，对于大家的学习或者工作都有一定的参考价值。有需要的朋友下面和边肖一起学习。

　　前言

　　在分享一个页面时，希望点击浏览器后退按钮，返回项目首页，增加访问量。

　　你需要监听浏览器的后退按钮，阻止它的默认事件。

　　具体步骤如下：

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

　　已安装(){

　　if(window . history window . history . pushstate){

　　history.pushState(null，null，document。网址)；

　　window . addevent listener( pop state ，this.goBack，false)；

　　}

　　},

　　2.当页面被破坏时，取消监控。否则，将监控其他vue路由页面。

　　销毁(){

　　window . removeeventlistener( pop state ，this.goBack，false)；

　　},

　　3.用方法写监控操作，removeEventListener取消监控的内容必须和开始监控的内容一致，所以函数用方法写。

　　方法：{

　　goBack(){

　　这个。$ router . replace({ path:/ })；

　　//replace替换原来的路由，用来避免陷入死循环。

　　}

　　}

　　附：popstate用来做什么的？

　　如何使用popstate的

　　HTML5的新API扩展了window.history，使得历史记录点更加开放。可以存储当前历史点pushState，替换当前历史点replaceState，监听历史点popstate。

　　pushState和replaceState的用法类似。

　　用法：

　　history.pushState(数据、标题、网址)；

　　//其中第一个参数数据是赋予state的值；第二个参数title是页面的标题，但是目前所有的浏览器都忽略了这个参数。只需传递一个空字符串；第三个参数url是你要去的链接；

　　replaceState的用法也差不多，比如：history.replaceState (home page ，，location . href # news )；

　　总结

　　关于vue浏览器返回监控的这篇文章到此为止。更多相关vue浏览器的返回监控内容，请搜索我们之前的文章或者继续浏览下面的相关文章。希望大家以后能多多支持我们！

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。