Tag Archives: Uncaught (in promise) NavigationDuplicated

Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to crrent location: “/home“

In Vue project, when repeatedly clicking route, the console will report an error:

Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to crrent location: “/home”

The online solution is to add the following code in the router folder:

// src/router/index.js

const VueRouterPush = Router.prototype.push
Router.prototype.push = function push (to) {
  return VueRouterPush.call(this, to).catch(err => err)
}

However, errors are still reported in the compilation process.

Finally, a solution is found

itemClick() {
  // Original code: this.$router.replace(this.path)
  // Add .catch(err=>err) after the code for route jumping
  // either the replace or push method will work
  this.$router.replace(this.path).catch(err=>err)
}