首页 > 解决方案 > 登录后页面重定向

问题描述

下面是 vue.js2 代码,当用户尝试使用凭据登录时,它应该重定向到仪表板视图,但是即使提供了正确的凭据,它也不会重定向:并且说不能路由到同一页面。

if (username && password) {
       const payload = { username, password };
       this.$store.dispatch(LOGIN,payload)
       .then((resp)=>{
         if(resp && resp.data.message==="Welcome" ) {
            this.error=false;
            console.log(this.$route.query)  // here it returns {} object
           this.$router.push(this.$route.query.redirect || "/");
         }
       })
        .catch(err => {
          this.error=true;
        console.log(err);
        });

编辑操作登录

[LOGIN]({commit}, payload) {
       // LOGIN user
        return loginService.LoginUser(payload).then(res => {
            const token = res.data.token;
            const user = res.data.userName
            localStorage.setItem('user', token)
            localStorage.setItem('token',user)
           //  axios.defaults.headers.common['Authorization'] = token
            commit(AUTH_SUCCESS, token,user);
            return res;
        }).catch(error => {
            commit(AUTH_ERROR, error);
            localStorage.removeItem('token')
            localStorage.setItem('token',user)
        });
    },

//编辑..错误

host-report-errors.js?44de:6 Unhandled promise rejection NavigationDuplicated {_name: "NavigationDuplicated", name: "NavigationDuplicated", message: "Navigating to current location ("/pages/login") is not allowed", stack: "Error↵    at new NavigationDuplicated (webpack-int…al:///./node_modules/vue/dist/vue.esm.js:1862:57)"}

标签: vue.jsvuex

解决方案


添加条件:

if (
    this.$route.path !== '/' && 
    this.$route.path !== this.$route.query.redirect
) { 
    this.$router.push(this.$route.query.redirect || "/") 
}

正如错误所说,您无法路由到您当前所在的同一条路线。


推荐阅读