геттеры всегда возвращают значение true в vuex

#vue.js #vuejs2 #vuex #vue-router

Вопрос:

isLoggedIn в геттерах всегда является истинным событием, если нет токена из API, я все еще могу перейти на все маршруты, я не знаю, в чем ошибка в маршруте охраны, или я неправильно храню токен в состоянии. в этом заявлении не работает, если(!store.getters.isLoggedIn){ перейдите для входа в систему} пожалуйста, помогите мне, я застрял 🙁

в 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();
    }
});

Ответ №1:

Попробуйте с :

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

и добытчик :

  isLoggedIn: (state) => state.Token,

1. не работает, когда я console.log(store.getters.isLoggedIn) в route.js он показывает isLoggedIn(состояние){ возвращаемое состояние. Токен !=null; }

2. попробуйте сейчас, пожалуйста, я обновил ответ

3. я пробовал, но это то же самое, я не знаю, как это решить 🙁

Ответ №2:

в то время access_token как в вашем локальном хранилище нет, затем localStorage.getItem('access_token') будет возвращено значение undefined , которое не равно нулю в нестрогой версии not != , поэтому ваш получатель всегда будет истинным
, вместо этого вы должны использовать (строгая версия не) или (двойная версия не ):
вариант 1 :

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

вариант 2 :

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