首页 > 解决方案 > 手动运行 vue-apollo 查询时禁用缓存

问题描述

我使用 vue-apollo 来处理 GraphQL。

我通过安装它vue add apollo,因此有一个用于配置的 vue-apollo.js。

当前配置:

// Call this in the Vue app file
export function createProvider (options = {}) {

  // Create vue apollo provider
  const apolloProvider = new VueApollo({
    defaultClient: apolloClient,
    defaultOptions: {
      $query: {
        fetchPolicy: 'no-cache',
        // fetchPolicy: 'cache-and-network',
      },
    },
    errorHandler (error) {
      // eslint-disable-next-line no-console
      console.log('%cError', 'background: red; color: white; padding: 2px 4px; border-radius: 3px; font-weight: bold;', error.message)
    },
  })

  return apolloProvider
}

我想做的是禁用任何查询的缓存。现在,当我通过apollo:组件属性进行查询时,它被禁用。但是当我通过 $apollo 实例手动运行查询时,它不起作用。

如果我为每个查询添加 fetchPolicy,它确实有效,例如:

  const response = await this.$apollo.query({
        query: documentSetListQuery,
        variables: {
          ...mapFilters(this.getActualFilters(this.filters), whitelistFilters),
          regime: false
        },
        fetchPolicy: 'no-cache'
      })

no-cache如果我通过手动运行查询,是否可以全局设置this.$apollo.query?只是为了避免fetchPolity: 'no-cache'重复

标签: vue.jsgraphqlvue-apollo

解决方案


推荐阅读