在 IE、chrome 中,通过 Element-Ui 的 el-menu 的 router 属性,点击切换路由是可以正常跳转的,但如果手动输入 url,chrome 可以正常跳转,但 IE 没有任何反应
<el-menu
class="navbar"
:default-active="activeIndex"
mode="horizontal"
router>
<el-menu-item
v-for="item in navList"
:key="item.code"
:index="`/${item.code}`">
</el-menu-item>
</el-menu>
Manual change of hash into the URL doesn’t trigger the route in IE11
这里面讨论的内容与上面问题类似,在 IE11 上无法用 router-link 跳转,主要是当 url 的 hash change 的时候浏览器没有做出响应。里面主要是做了一个兼容。
// main.js
// 解决在 IE 下,当 url 的 hash change 的时候浏览器没有做出相应
if ('-ms-scroll-limit' in document.documentElement.style &&
'-ms-ime-align' in document.documentElement.style) { // detect it's IE11
window.addEventListener('hashchange', function (event) {
let currentPath = window.location.hash.slice(1)
router.push(currentPath)
}, false)
}
这个兼容就是当检测到浏览器为 IE 的时候,手动给 url 加一个 hashchange 事件。