Как обновить / обновить результат в запросе vue apollo, который используется в методе - PullRequest
Новая
       37

Как обновить / обновить результат в запросе vue apollo, который используется в методе

3 голосов
/ 09 апреля 2019

Я хочу обновить или повторно получить данные в запросе apollo, который используется в методе (не объект apollo).дело в том, что я хотел запрашивать и обновлять этот запрос после определенного события, поэтому я не мог использовать объект apollo непосредственно в моем коде. 

methods: {
    async fetchEvents() {
      const { data } = await this.$apollo.query({
        query: gql`
            query(
              $someThing: Int,
            ) {
                events (
                  someThing: $someThing,
                ) {
                    total
                    items {
                     ...
                    }
                }
            }
        `,
        variables() {
          return {
            ...
          };
        },
      });
      this.data = data;
    },
  },


  watch: {
    'items.view.organizerId': function callback() {
      this.fetchEvents();
    },
    eventsSearchInputVal: function callback() {
      this.fetchEvents();
    },
    'pagination.statusFilter': function callback() {
      this.fetchEvents();
    },
  },

в заключение, когда pagination.statusFilter или eventsSearchInputVal или items.view.organizerId в watch получили изменения, запрос должен быть повторно выполнен.в этом коде ничего не происходит при изменении этих переменных.

1 Ответ

0 голосов
/ 25 июля 2019

я не знаю почему, но я изменил variables() метод на объект, и он исправлен.теперь этот код работает: 

methods: {
    async fetchEvents() {
      const { data } = await this.$apollo.query({
        query: gql`
            query(
              $someThing: Int,
            ) {
                events (
                  someThing: $someThing,
                ) {
                    total
                    items {
                     ...
                    }
                }
            }
        `,
        variables: { // this is an object now
            ...
        },
      });
      this.data = data;
    },
  },


  watch: {
    'items.view.organizerId': function callback() {
      this.fetchEvents();
    },
    eventsSearchInputVal: function callback() {
      this.fetchEvents();
    },
    'pagination.statusFilter': function callback() {
      this.fetchEvents();
    },
  },
...