I have the user state stored in my Vue store, but when I try to access it like this:
let isLoggedIn = store.getters.isLoggedIn
Instead of getting a simple true or false, I see this in the console:
ƒ isLoggedIn (state) { return state.user ? true : false; }
This is my store code:
let store = {
state: {
user: '',
},
mutations: {
setAuthUser(state, user) {
state.user = user;
}
},
getters: {
isLoggedIn(state) {
return state.user ? true : false
}
}
};
export default store;
In my app.js, where I call the getter:
router.beforeEach((to, from, next) => {
let isLoggedIn = store.getters.isLoggedIn
console.log(isLoggedIn)
if (to.matched.some(record => record.meta.requiresAuth)) {
// This route requires auth, so check if user is logged in.
// If not, redirect to login page.
if (!isLoggedIn) {
next({
path: '/login',
query: { redirect: to.fullPath }
})
} else {
next()
}
} else {
next() // Always call next()!
}
})