IE浏览器,vue-router跳转不响应处理

1,806 阅读1分钟

问题:

vue项目router-link在IE下无响应,谷歌和火狐正常

原因:

当url的hashchange的时候IE浏览器没有做出响应

发现在vue-router的一个issue也提到这个问题

解决方式:

只需要将以下代码放在APP.vue 中就好了

<template>
<div id="app">
  <router-view/>
</div>
</template>
<script>
export default {
  name: 'APP',
  created () {
    // 主要是当url的hashchange的时候浏览器没有做出响应, 检测到浏览器为IE的时候,手动给url加一个hashchange事件。
    if ('-ms-scroll-limit' in document.documentElement.style
      && '-ms-ime-align' in document.documentElement.style) {
      window.addEventListener('hashchange', (event) => {
          var currentPath = window.location.hash.slice(1)
          if (this.$route.path !== currentPath) {
            this.$router.push(currentPath)
          }
      }, false)
    }
  }
}
</script>