Avoided redundant navigation to current location 'xxx'

611 阅读1分钟

vue 使用 elementUI 菜单重复点击报错 如下

1634103801(1).jpg

解决方法

import Router from 'vue-router';

~~~

const routerPush = Router.prototype.push;
Router.prototype.push = function push(location) {
  return routerPush.call(this, location).catch(error => error);
};

逮一下报错原因(上面的代码已经可以解决问题,感兴趣的可以看下.)

image.png

  • 点击这个,到sources, 这里我们很显然的可以看到报错是 vue-router.js文件暴露出来的 image.png

  • 找到这个报错函数,顺便再这里打一个debugger(不会打的,就点击上图红色圈起来的小块) image.png

  • 在点击一遍菜单,执行到报错debugger位置, 然后点击这个上行的跳函数的箭头(上图红色圈起来的箭头) image.png

  • 点击一下发现是函数 createNavigationDuplicatedError return 的error,在点击一下up箭头

image.png

  • 好,到这里就发现了,是confirmTransition 这个函数里进行了判断.然后return的异常,至于判断条件为什么会满足,或者应该是什么样的,大家可以自己在去研究一下.

大家看找问题的方法,定位问题的过程就好.以后遇到问题,如果想追根究底,可以自己去找原因.