Live article: https://www.storyblok.com/faq/how-to-use-the-nuxt-context-in-an-vuex-store
- FAQ
- How to use the nuxt context in an vuex store?
Using the current Nuxt context and therefore $storyapi
and $storybridge
the easiest way to achieve that is to pass the parts of the context you need into the action of your Nuxt.js Vuex store.
In your fetch
/ asyncData
you can dispatch your action:
context.store.dispatch('loadInActionExample', { data: 'test', context: context })
And in your store actions you can either go for this.$storyapi
directly or use the content of the payload to access the data/context you need.
export const actions = {
loadInActionExample(storeContext, payload) {
// available: this.$storyapi
// payload.data -> actual action parameters
// payload.context -> whole nuxt context -> exchange that to smaller parts that you need.
// execute your action and set data
storeContext.commit('setData', payload.data)
}
}