getters 在 vuex 中总是返回 true答案

【问题标题】：getters is always return true in vuexgetters 在 vuex 中总是返回 true
【发布时间】：2021-11-16 17:15:23
【问题描述】：

如果没有来自 API 的令牌，getter 中的 isLoggedIn 始终是 true 事件，我仍然可以转到每条路由，但我不知道保护路由中的错误是什么，或者我在状态中存储了错误的令牌。在此语句中不起作用 if(!store.getters.isLoggedIn){ go to login} 请帮助我，我被卡住了:(

在 store.js 中

state:{
    Token: localStorage.getItem('access_token') || null,
}
mutations:{
    AUTHENTICATION(state,token){
        state.Token = token;
    },
    UNAUTHENTICATION(state,response){
        state.Token = response;
    }
},
getters:{
    isLoggedIn(state){
        return state.Token !=null;
    }
},
actions:{
    loginUser({commit}, formData){                
          http.post("/login",formData).then((response)=>{
                if(response.data.status === 'success'){
                    const token = response.data.token;
                    localStorage.setItem('access_token',token);
                    localStorage.setItem('user',response.data.user);
                    commit('AUTHENTICATION',token);                         
                    router.push({name:'Dashboard'});
                    router.go();
                }else{
                    commit("LOGIN_ERROR",response.data.message);
                }
            })
            .catch((error)=>{
                if(error){
                    commit('UNAUTHENTICATION',null);                        
                    localStorage.removeItem('access_token');
                    commit("GET_ERRORS",error.response.data.errors);
                }
            });
        });
    },
    logoutUser({commit}){
        http.post("/auth/logout").then((response)=>{
            if(response.data.status === "success"){
                localStorage.clear();
                commit('UNAUTHENTICATION',null);
                router.push({name:'Login'});
                window.location.reload();
            }else{
                commit("LOGIN_ERROR",response.data.message);
            }
        })
        .catch((error)=>{
            if(error){
                commit("GET_ERRORS",error.response.data.errors);
            }
        });
    }
},

在 route.js 中

route.beforeEach((to, from, next) => {
    const requiresAuth = to.matched.some(record => record.meta.requiresAuth);
    if(requiresAuth){ 
        if(!store.getters.isLoggedIn){
            next({name: 'Login'}); 
        }else{
            next();
        }
    }else{
        next();
    }
});

【问题讨论】：

在 getter 中尝试 console.log(state.Token) 确保数据
令牌仍然存在，但它仍然无法正常工作:(我该怎么做我被困了将近一个星期。

标签： vue.js vuejs2 vuex vue-router

【解决方案1】：

尝试：

if(!store.getters.isLoggedIn || store.getters.isLoggedIn === '') {
  //...

和吸气剂：

 isLoggedIn: (state) => state.Token,

【讨论】：

当我在 route.js 中的 console.log(store.getters.isLoggedIn) 显示 isLoggedIn(state){ return state.Token !=null; 时不起作用}
现在试试，请更新答案
我试过了，但我不知道如何解决这个问题:(

【解决方案2】：

虽然您的本地存储中没有access_token，但localStorage.getItem('access_token') 将返回值undefined，它在non-strict not version != 中不等于null，所以你getter永远是真的
相反，您应该使用 (strict not version) 或 (double not version )：
选项 1：

getters:{
    isLoggedIn(state){
        return state.Token !== null; //double equals
    }
}

选项 2：

getters:{
    isLoggedIn(state){
        return !!state.Token; // double !
    }
}

【讨论】：

不工作 :( .
!store.getters.isLoggedIn 的结果总是返回 false 是什么意思？