используя асинхронные данные на моей странице, используя nuxtjs - PullRequest
0 голосов
/ 01 июля 2018

Я прочитал с использованием асинхронных данных или выборки - лучший подход на страницах в nuxtjs вместо использования созданного хука.

Я изо всех сил пытаюсь заставить мой код работать, хотя

У меня было следующее (что работает нормально)

created () {
  this.$store.dispatch('cases/getCase', this.$route.params.caseId );
},

Но как мне изменить это, чтобы вместо этого работать с асинхронным методом, и иметь возможность возвращать более одного состояния, когда мне нужно.

Я попробовал следующее

     async asyncData ({ params }) {
        const thisCase = await this.$store.dispatch('cases/getCase', this.$route.params.caseId );
// constant thisUser
        return { thisCase }
// return { thisCase, thisUser}
      },

но это породило ошибку

undefined не является объектом (оценка 'this. $ Store')

Может кто-нибудь сказать мне, что я делаю не так, пожалуйста

Спасибо

1 Ответ

0 голосов
/ 01 июля 2018

this недоступно в asyncData / fetch. Это даже указано в документах в специальном оранжевом предупреждении.

У вас нет доступа к экземпляру компонента через это внутри asyncData, потому что он вызывается перед инициацией компонента.

И снова, как сказано в документах

метод получает объект контекста в качестве первого аргумента, вы можете использовать чтобы получить некоторые данные и вернуть данные компонента.

Контекст - это то, откуда вы должны получить свой магазин. Здесь документы для контекста.

Итак, ваш код будет

 async asyncData ({ params, store }) {
    const thisCase = await store.dispatch('cases/getCase', params.caseId )
    return { thisCase }
  }, 
...