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

Posted 2023-03-08

【中文标题】如何在 Vue 组件事件中触发 Apollo 查询？

【英文标题】：How to trigger an Apollo query in a Vue component event?

【发布时间】：2017-08-08 18:27:30

【问题描述】：

如何在 Vue.js 组件中对 mounted 事件触发 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>

查询在组件第一次加载时运行良好，但我怎样才能让它与各种事件一起运行？

【问题讨论】：

将查询设为方法并在事件发生时调用它。

【参考方案1】：

this.$apollo.queries.books.refetch();

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

this.$apollo.queries.books.refetch(variables);