Как сделать mapGetters в asyncData? Nuxt - PullRequest
Новая
       2

Как сделать mapGetters в asyncData? Nuxt

0 голосов
/ 21 октября 2019

Моя цель - передать объект-получатель внутри asyncData, потому что мне нужно получить доступ к состоянию для передачи данных в axios

Пример кода 

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

Как видите, я хочуполучить объект доступа в asyncData Однако я получил

enter image description here

Ответы [ 2 ]

1 голос
/ 21 октября 2019

Как указано в документации ...

Предупреждение : у вас нет доступа к экземпляру компонентачерез this внутри asyncData, потому что он вызывается до запуска компонента.

Вместо этого используйте предоставленный объект context 

async asyncData ({ store }) {
  const body = { data: store.getters.totalPrice }
  const { data } = await $axios.$post('/api/test', body)
  return data
}
0 голосов
/ 21 октября 2019

Методы должны быть помещены в методы, чтобы иметь контекст vue: 

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

Если вы хотите сделать это при загрузке, используйте mount (https://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"])
   }
}
...