我们在学习vue-router的编程式导航时，我们发现如果多次重复点击某个按钮触发页面跳转，会出现如下“NavigationDuplicated”错误，这里我先贴上我的部分代码：

 // template中菜单按钮 <button @click="toBlog">博客</button> // 对应的click事件的跳转方法 toBlog(){ this.$router.push("/blog"); } // 路由配置 { name:"Blog", path:"/blog", component:()=>import('@/components/Blog.vue') } 

连续多次点击博客按钮，会出现如下错误：

虽然对代码运行没有任何影响，但是看上去还是很不爽！

重复路由跳转，我们当前路由是博客页面/blog，但是再点击博客按钮进行this.$router.push操作，要跳转的页面还是/blog博客页面。

1）升级vue-router版本为3.0即可解决，打开项目终端运行如下命令：

 npm i vue-router@3.0 -S 

2）修改VueRouter原型对象上的push方法，在router文件夹下的index.js中的Vue.use(VueRouter)代码下方加入如下代码：

 //获取原型对象上的push函数 const originalPush = VueRouter.prototype.push //修改原型对象中的push方法 VueRouter.prototype.push = function push(location) { return originalPush.call(this, location).catch(err => err) }