发现最近做的vue项目中,在IE浏览器下,当router改变时,虽然页面中的URL改变了,但页面并没有跳转。查阅资料后找到如下解决方案,在App.vue文件中的mounted里面添加如下代码。

function checkIE(){
    return '-ms-scroll-limit' in document.documentElement.style && '-ms-ime-align' in document.documentElement.style
}
if (checkIE()) {
    window.addEventListener('hashchange', () => {
        var currentPath = window.location.hash.slice(1);
        if (this.$route.path !== currentPath) {
            this.$router.push(currentPath)
        }
    }, false)
}

      调试后却没有效果,路由跳转后并没有触发hashchange事件。于是尝试将代码写到了main.js中,页面成功跳转了。

      本以为到此大功告成,但随后因为业务代码导致了其他IE浏览器的兼容问题,修改业务代码(减少引入了一个自定义组件)后,兼容性问题解决了。随后删除了在main.js中添加的兼容性代码,在IE中vue-router依然可以正常跳转。

      至此疑惑点有二:1、被取消引入的自定义组件,哪里导致了IE的不兼容?2、如果是由业务代码导致的IE不兼容,那么其他遇到此问题,并用上述方案解决的同学,又是由什么原因导致的vue-router不跳转呢?

      遇到此问题的同学可以一起探讨一下,也希望有大神能指点迷津。

Logo

前往低代码交流专区

更多推荐