vue-router在ie11下的兼容性问题

今天发现vue-router的一个普通的A标签导航,里面写的哈希值链接,在IE11下点击会报错,SCRIPT5007: 无法获取未定义或 null 引用的属性“path”,经过查阅和测试,找到了一个解决办法,具体如下

const IE11RouterFix = {
  methods: {
    hashChangeHandler: function () { this.$router.push(window.location.hash.substring(1, window.location.hash.length)); },
    isIE11: function () { return !!window.MSInputMethodContext && !!document.documentMode; }
  },
  mounted: function () { if (this.isIE11()) { window.addEventListener('hashchange', this.hashChangeHandler); } },
  destroyed: function () { if (this.isIE11()) { window.removeEventListener('hashchange', this.hashChangeHandler); } }
};

new Vue({
  router,
  store,
  mixins: [IE11RouterFix], // 这里
  render: h => h(App)
}).$mount('#app')

来源
https://github.com/vuejs/vue-router/issues/1911

分享