vue路由变化没有触发hashchange事件。

Question

问题描述

最近项目需要监听vue路由的变化，网上说使用'hashchange'来监听但是，普通跳转并不能触发，只有后退和前进可以触发。

问题出现的环境背景及自己尝试过哪些方法

相关代码

window.addEventListener('hashchange', function (e) { 
    console.log(e.oldURL);
    console.log(e.newURL)
  }, false)

你期待的结果是什么？实际看到的错误信息又是什么？

1.为啥没有触发‘hashchange’？
2.外部如何监听单页应用页面变化？

Answer 1

vue-router 底层调用的是history.pushState和history.replaceState, 这2个api对url的更新不限于hash, 不会触发hashchange

监听可以用vue-router的导航守卫, 或者window.onpopstate