[Vuejs]-How to do mapGetters in asyncData? Nuxt

by

3👍

As indicated in the documentation…

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

Instead, use the context object provided

async asyncData ({ store }) {
  const body = { data: store.getters.totalPrice }
  const { data } = await $axios.$post('/api/test', body)
  return data
}
👤Phil

-2👍

Methods should be placed into methods to have the vue context:

export default {
   methods : {
      async asyncData() {
         let result = await $axios.$post('/api/test', { data: this.totalPrice })
      }
   },
   computed: {
      ...mapGetters(["totalPrice"])
   }
}

If you want to do it onload use mounted (https://v2.vuejs.org/v2/guide/instance.html#Lifecycle-Diagram)

export default {
   async mounted() {
      let result = await $axios.$post('/api/test', { data: this.totalPrice })
   },
   computed: {
      ...mapGetters(["totalPrice"])
   }
}
👤dreijntjens

Leave a comment