网上找到有很多关于vue-router组件复用问题的回答,但是我的问题和组件复用无关…
记录一下网上好不容易找到的解决方法,原文更详细一点:Vue项目:IE11中地址栏直接改变路由页面不跳转bug
bug描述:
使用vue-cli搭建的项目, vue-router控制路由.
兼容谷歌 火狐 IE11及IEedge.
在谷歌 火狐 IEedge的地址栏直接改变路由地址, 回车的话, 路由页面能够刷新到响应路由界面.
但是在IE11中, 地址栏虽然改变了, 但页面却没有任何变化.
解决办法:
在app.vue中, 先判断是IE浏览器, 是的话, 给window绑定一个哈希值变化的事件, 当哈希值发生变化时, 将通过$router.path获取当前界面的路由, 与地址栏中的改变的哈希值就行比较, 如果不同, 就调用vue-router的push方法, 人为的去改变路由. 上代码:
mounted(){
if (!!window.ActiveXObject || 'ActiveXObject' in window) {
window.addEventListener('hashchange', () => {
let currentPath = window.location.hash.slice(1)
if (this.$route.path !== currentPath) {
this.$router.push(currentPath);// 主动更改路由界面
}
}, false);
}
}