介绍：项目中对当前登录的用户类型进行相应的菜单权限限制，为防止用户在浏览器网址栏中手动输入path，然后回车就可以进入该页面，所以需要做一个拦截，但是又不想为每一个路由都写一个守卫就在最外侧路由组件 由于种种原因没有采用路由守卫  用的是watch $route监听当前路由的变化  在这里判断用户是否有权限进入到要去的路由，没有权限就跳到概览页，这时候报了一个错Navigation cancelled from“/...“ to “/...“ with a new navigation.

百度了一下是因为vue-router内部错误,没有进行catch处理,导致的编程式导航跳转问题,往同一地址跳转时会报错的情况。

百度到的解决方案

方案一：
安装vue-router3.0以下版本：

        先卸载3.0以上版本然后再安装旧版本 npm install vue-router@2.8.0 -S

方案二：
针对于路由跳转相同的地址添加catch捕获一下异常：

        this.$router.push(’/location’).catch(err => { console.log(err) })

方案三：
        在main.js下注册一个全局函数

我使用的是方案二，因为公司项目框架什么的能不动主要内容就不动，动自己的代码就好