I'm facing an issue with setting the state in Vuex on my Nuxt.js App. It seems to not be working correctly. So, here is how I am trying to set the state using the fetch method:
fetch({app, store, route}) {
app.$axios.$get(`apps/${route.params.id}`)
.then(res => {
store.dispatch('setApp', {
...res,
id: route.params.id
})
console.log(app.store.state.app);
})
}
Everything works fine here when I log 'app.store' - the data is present. However, when I try to log it in:
created() {
console.log(this.$store);
},
mounted() {
console.log(this.$store);
}
Below is my store code:
const store = () => new Vuex.Store({
state: {
app: ''
},
mutations: {
'SET_APP' (state, payload) {
state.app = payload
}
},
actions: {
setApp (ctx, payload) {
ctx.commit('SET_APP', payload)
}
},
getters: {
}
})
The state appears to be empty and as a result, the data is not rendering on my template. I would appreciate any help!
P.S: The logging works fine on the client-side, but not on SSR.