需求：

登陆之后才能查看主页面，否则跳转至登录页

遇到的问题：

一开始是打算直接在拦截器跳转路由的，发现会报错Avoided redundant navigation to current location: "/login".

后来灵机一动，用了全局路由守卫，完美解决

request.interceptors.request.use(config=>{config.headers['Content-Type']='application/json;charset=utf-8'let user=localStorage.getItem("user")if(!user){router.push("/login")}return config
},error=> {return Promise.reject(error)
})

报错：

解决方案：

添加全局路由守卫，并通过localStorage存储信息

全局路由守卫：

router.beforeEach((to,from,next)=>{let user = localStorage.getItem("user");if(!user){if(to.path!=='/login'){next({path:"/login"})}else{next()}}else{next()}
})

登录界面的逻辑判断：

         request.post("/user/login",this.form).then(res=>{if(res.code==='0'){this.$message({type:"success",message:"登录成功"})localStorage.setItem("user",JSON.stringify(res.data))this.$router.push("/")}else{this.$message({type:"error",message:res.msg})}})

报错：Avoided redundant navigation to current location: “/login“.完美解决相关推荐

vue报错 Avoided redundant navigation to current location: “/search“
报错信息: Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: ...
Vue组件多次点击报错Avoided redundant navigation to current location: “/profile“.
报错提示profile组件避免了到当前位置的冗余导航. 在VueRouter后添加 const originalPush = VueRouter.prototype.push VueRouter.pr ...
解决vue-router报NavigationDuplicated: Avoided redundant navigation to current location: “/login“ 的问题
一.普遍问题解决方法 import Router from 'vue-router'; Vue.use(Router); // 解决ElementUI导航栏中的vue-router在3.0版本以上重复 ...
vue-router 报错Error: Avoided redundant navigation to current location: “/index/user“解决方式
问题使用ivew Menu 制作的导航菜单,连续点击同一个导航时报错该报错不影响功能当前地址 http://localhost:8080/#/transfer/index 连续点击–信息录入报 ...
Vue路由跳转报错Avoided redundant navigation to current location: “/xxxxxx“.
在使用this.$router.push进行路由的跳转时,出现如下报错: 今天在开发的过程遇到了上述问题,通过查阅资料得到了解答,以自己的理解进行了整理报错原因: 当我们在使用编程式路由进行页面跳转 ...
解决Vue报错：Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location
问题描述:重复点击导航时,控制台出现报错 ,虽然不影响功能使用,但也不能坐视不管. 解决 Vue 重复点击相同路由,出现 Uncaught (in promise) NavigationDuplica ...
解决报错：Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: “
报错内容: vue-router.esm.js?68cf:2065 Uncaught (in promise) NavigationDuplicated: Avoided redundant navi ...
四种解决Vue中重复点击相同路由控制台报错问题（ Avoided redundant navigation to current location）
vue-router 升级到3.1.x 后,重复点击导航时,控制台出现报错 ,虽然不影响功能使用,但是看的就不舒服. 报错信息 Uncaught (in promise) NavigationDupl ...
前端开发：Vue项目报错NavigationDuplicated：Avoided redundant navigation to current location：“/XXX”的解决方法
最近在Vue项目开发的过程中遇到一个问题,那就是在点击同一个路由操作的时候,控制台会报一下错误提示: Uncaught (in promise) NavigationDuplicated: Avoid ...

报错：Avoided redundant navigation to current location: “/login“.完美解决

需求：

遇到的问题：

解决方案：

报错：Avoided redundant navigation to current location: “/login“.完美解决相关推荐

最新文章

热门文章