如何解决vue中避免冗余导航到当前位置错误? [英] How to solve Avoided redundant navigation to current location error in vue?

问题描述

我是 vue 新手，在用户登录并重定向到另一条路由后出现错误.基本上我是一名 PHP 开发人员，我在 vue 中使用 laravel.请帮我解决这个错误.

I am new in vue and i got the error after user logged in and redirect to another route. Basically i am a PHP developer and i use laravel with vue. Please help me to solve this error.

未捕获(承诺)错误:避免了到当前位置的冗余导航:/admin".

Uncaught (in promise) Error: Avoided redundant navigation to current location: "/admin".

这里也是截图

Vue 代码

 methods: {
        loginUser() {
            var data = {
                email: this.userData.email,
                password: this.userData.password
            };
            this.app.req.post("api/auth/authenticate", data).then(res => {
                const token = res.data.token;
                sessionStorage.setItem("chatbot_token", token);
                this.$router.push("/admin");
            });
        }
    }

Vue 路由

const routes = [
    {
        path: "/admin",
        component: Navbar,
        name: "navbar",
        meta: {
            authGuard: true
        },
        children: [
            {
                path: "",
                component: Dashboard,
                name: "dashboard"
            },
            {
                path: "users",
                component: Users,
                name: "user"
            }
        ]
    },
    {
        path: "/login",
        component: Login,
        name: "login"
    }
];

const router = new VueRouter({
    routes,
    mode: "history"
});

router.beforeEach((to, from, next) => {
    const loggedInUserDetail = !!sessionStorage.getItem("chatbot_token");
    if (to.matched.some(m => m.meta.authGuard) && !loggedInUserDetail)
        next({ name: "login" });
    else next();
});

推荐答案

我记得很清楚，你可以在 this.$router.push 之后使用 catch 子句.然后它看起来像:

As I remember well, you can use catch clause after this.$router.push. Then it will look like:

this.$router.push("/admin").catch(()=>{});

这允许你只避免错误显示，因为浏览器认为异常被处理了.

This allows you to only avoid the error displaying, because browser thinks the exception was handled.

这篇关于如何解决vue中避免冗余导航到当前位置错误?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！