I am moving from classic vuex to modular vuex, but i need some help understanding how to call getters in my app. Here's what I have in store:
store/user.js
:
export const state = () => ({
currentUser: null,
userProfile: {}
})
export const getters = {
loggedIn(state) {
return !!state.currentUser
}
}
When I call loggedIn
from my app, I get loggedIn
as undefined
. Here's how I am calling loggedIn
:
src/components/MainNav.vue
:
computed: {
loggedIn() {
return this.$store.getters.user.loggedIn
}
}
Anyone spot what I am doing wrong? Thank you!
Your store has the user
namespace, so you have to call your loggedIn
getter as below:
computed: {
loggedIn() {
return this.$store.getters['user/loggedIn']
}
}
Another way is to use the mapGetter
helper, as explains in Vuex docs