编程式导航路由跳转到当前路由(参数不变), 多次执行会抛出NavigationDuplicated的警告错误?

• 这种异常对程序的运行没有任何的影响
• 为什么会出现这种现象?
• 是因为vue-router最新版本3.5.2,引入了promise,当传递参数多次且重复,会抛出异常,因此出现该现象
• 第一种解决方法: 是给push函数,传入相应的成功与失败的回调(治标不治本)
• 第二种解决方法: 重写VueRouter原型链上的push和replace方法

// *重写VueRouter底层push方法
// 1.先保存一份VueRouter原型对象的push
let originPush = VueRouter.prototype.push;
// 备份replace
let originReplace = VueRouter.prototype.replace;
// 2. 重写push和replace
// 第一个参数: 告诉原来的push方法,你往哪里跳转
// 第二个参数: 成功的回调(自定义)
// 第三个参数: 失败的回调(自定义)
VueRouter.prototype.push = function (location, resolve, reject) {
  if (resolve && reject) {
    // 注意 不能直接调用,需要调用的是原来上下文环境下的push方法
    originPush.call(this, location, resolve, reject);
  } else {
    originPush.call(
      this, location, () => { }, () => { });
  }
};
VueRouter.prototype.replace = function (location, resolve, reject) {
  if (resolve && reject) {
    originReplace.call(this, location, resolve, reject);
  } else {
    originReplace.call(
      this, location, () => { }, () => { });
  }
}