如何在 Vue 组件事件中触发 Apollo 查询?

Rae*_*MAM 3 javascript vue.js graphql vuejs2 apollo-client

如何mounted在 Vue.js 组件中的事件上触发 Apollo GraphQL 查询。

这是我的代码的样子:

<template>
</template>

<script>
import gql from 'graphql-tag';

const myQuery = gql`
  query someQuery {
    books{
      id
   }
}`

export default {
  data: () => ({
    books: []
  }),
  apollo: {
    books: {
      query: myQuery,
    },
  },
  mounted () {
  // run the appollo query here as well ?
  }
};
</script>
Run Code Online (Sandbox Code Playgroud)

查询在组件的第一次加载时运行良好,但如何让它在各种事件中运行?

cef*_*ari 6

this.$apollo.queries.books.refetch();
Run Code Online (Sandbox Code Playgroud)

如果您有变量并且需要在每次调用时更新它们,请将它们作为方法 refetch 的参数传递:

this.$apollo.queries.books.refetch(variables);
Run Code Online (Sandbox Code Playgroud)