CODEWITHSUNDEEP
vue.jsnuxt.js
frezzzen
frezzzen

Reputation: 115

Fetching global api data in nuxt

I'm starting Nuxt project and I have to fetch basic data from my backend. for example language dictionary or some data for leftbar and etc. in Vue I can just call everything I need in App.vue and save it in vuex and then use whenever I want, but with Nuxt every page is different and I'm curious where should i call this global data api calls. I'm guessing I have to create middleware and call actions if data is not loaded already or there is better solution?

Upvotes: 0

Views: 1290

Answers (1)

Nick Dawes
Nick Dawes

Reputation: 2244

You mention it's global data and you're using universal mode- I think you're looking for nuxtServerInit(). This store action runs once on the server, before created, mounted hooks etc. You can use it to populate your store with data that your components (including pages) rely on.

Take a look at the docs.

actions: {
  nuxtServerInit ({ commit }, { req }) {
    if (req.session.user) {
      commit('user', req.session.user)
    }
  }
}

Upvotes: 2

Related Questions