Как получить доступ к хранилищу vuex с помощью функции fetch или asyncData в Nuxt JS? - PullRequest
Новая
       120

Как получить доступ к хранилищу vuex с помощью функции fetch или asyncData в Nuxt JS?

0 голосов
/ 02 мая 2020

Я хочу получить доступ к хранилищу vuex, в частности, к получателям из обработчика хука.

Вот мои загрузчики, которые я загружаю, используя mapGetters на странице заказа 

computed: {
    ...mapGetters("auth", ["authUser"])
  },

Вот вызов apollo из извлечения крючка и я пытаюсь предоставить authUser.id в качестве переменной, которая предоставляется authUser getter из хранилища vuex. 

async fetch() {
    console.log("fetch order is called");
    const orderInput = {
      userId: this.authUser.id,
      orderStatus: "PENDING"
    };

    const response = await this.$apollo.query({
      query: getOrdersByUserIdQuery,
      variables: { orderInput }
    });

    this.orders = response.data.getOrderByUserId.orders;
    console.log("getOrderResponse", response);
  },

Но он не загружается authUser из магазина при начальной загрузке страницы.

Мне любопытно узнать, правильны ли мои шаги или нет. Если это не правильно, каковы другие альтернативы, которым я могу следовать?

1 Ответ

0 голосов
/ 06 мая 2020

Если ваша версия Nuxt>> 2.12

, возможно, вы можете попытаться использовать анонимное промежуточное ПО для получения контекста

, например: 

async middleware({ store }) {
    await store.dispatch('one/fetchSomething')
  },

В документе https://nuxtjs.org/api/pages-fetch/ говорит:

извлечение (контекст) устарело, вместо этого вы можете использовать анонимное промежуточное ПО на своей странице: промежуточное ПО (контекст)

...