[Vuejs]-Load async data into the vuex store when Nuxt app loads

by

3👍

What you need is called a fetch.

The fetch method, if set, is called every time before loading the component (only for page components). It will be called server-side once (on the first request to the Nuxt app) and client-side when navigating to further routes.

Warning: You don’t have access of the component instance through this inside fetch because it is called before initiating the component.

async fetch({ store }) {
  await store.dispatch('your-action')
}

If you need parameter:

async fetch({ store, params }) {
  await store.dispatch('your-action', params.id)
}

I gave an example of id. The name of the parameter depends on the name of your page.

_id => params.id
_slug => parmas.slug
...
👤Miloš Pantelinac

Leave a comment