美文网首页
2020-03-18 解决vue-router在IE11下不跳转

2020-03-18 解决vue-router在IE11下不跳转

作者: 追寻1989 | 来源:发表于2020-03-18 18:30 被阅读0次
    IE11 报错图片

    解决办法1(推荐):

    main.js

    // 补全IE不兼容的函数
    import '@/polyfill.js'
    

    polyfill.js

    // ie es6数组函数设置
    // https://tc39.github.io/ecma262/#sec-array.prototype.findIndex
    if (!Array.prototype.findIndex) {
      Object.defineProperty(Array.prototype, 'findIndex', {
        value: function(predicate) {
          // 1. Let O be ? ToObject(this value).
          if (this == null) {
            throw new TypeError('"this" is null or not defined');
          }
    
          var o = Object(this);
    
          // 2. Let len be ? ToLength(? Get(O, "length")).
          var len = o.length >>> 0;
    
          // 3. If IsCallable(predicate) is false, throw a TypeError exception.
          if (typeof predicate !== 'function') {
            throw new TypeError('predicate must be a function');
          }
    
          // 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
          var thisArg = arguments[1];
    
          // 5. Let k be 0.
          var k = 0;
    
          // 6. Repeat, while k < len
          while (k < len) {
            // a. Let Pk be ! ToString(k).
            // b. Let kValue be ? Get(O, Pk).
            // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
            // d. If testResult is true, return k.
            var kValue = o[k];
            if (predicate.call(thisArg, kValue, k, o)) {
              return k;
            }
            // e. Increase k by 1.
            k++;
          }
    
          // 7. Return -1.
          return -1;
        }
      });
    }
    

    解决办法2(不推荐):

    在app.vue中, 先判断是IE浏览器, 是的话, 给window绑定一个哈希值变化的事件, 当哈希值发生变化时, 将通过$router.path获取当前界面的路由, 与地址栏中的改变的哈希值就行比较, 如果不同, 就调用vue-router的push方法, 人为的去改变路由.
    上代码:
    app.vue

    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);
      }
    }
    

    参考文献:https://zhuanlan.zhihu.com/p/47873302

    相关文章

      网友评论

          本文标题:2020-03-18 解决vue-router在IE11下不跳转

          本文链接:https://www.haomeiwen.com/subject/himcyhtx.html