当graphql中的数据反应时如何调用2次？答案

【问题标题】：how to call 2 times when data in graphql react?当graphql中的数据反应时如何调用2次？
【发布时间】：2020-02-24 14:27:01
【问题描述】：

loadGreeting() 不是由其他时间引起 props.currentStore 的变化

  const [loadGreeting, { called, loading, data }] = useLazyQuery(
      GET_COOKIES,
     { context: {
        headers: {
          "x-request-shop-id": props.currentStore ? props.currentStore.id : ""
        },
      }},
  );

  useEffect(() => {
    if (props.currentStore.id) {
      loadGreeting();// here it comes a change but does not cause other data props.correntStore
  }
  }, [props.currentStore ]);

【问题讨论】：

标签： reactjs graphql react-hooks

【解决方案1】：

useQuery 或 useLazyQuery 是一个声明性的 React Hook。它并不意味着在经典函数的意义上被调用来接收数据。首先，确保了解 React Hooks 或者暂时不要使用它们（Stackoverflow 上 90% 的问题是因为人们试图一次学习太多东西）。 Apollo 文档对于使用渲染道具的官方 react-apollo 包非常好。这同样有效，一旦您了解了 Apollo Client 和 Hooks，您就可以进行一些重构。所以你的问题的答案：

如何多次调用useQuery？

您不会多次调用它。当查询结果可用或更新时，组件将自动重新呈现。

我可以随时调用吗？

不可以，只能在顶层调用钩子。相反，数据可以在您的函数中从上层范围（闭包）中获得。

【讨论】：

这并没有回答所问的问题，即如何执行“useLazyQuery”多次返回的回调。问题不在于如何多次运行该钩子。这不应该是公认的答案。
如果你不开始使用 React Hooks，你应该如何理解它们？

【解决方案2】：

默认情况下，查询使用cache-first 作为获取策略。所以 ApolloClient 不会在服务端查询缓存中可用的数据。

您应该将获取策略更改为cache-and-network，然后 ApolloClient 将在服务器端查询数据，即使它们在缓存中是否可用。

const [loadGreeting, { called, loading, data }] = useLazyQuery(GET_COOKIES, {
  context: {
    headers: {
      'x-request-shop-id': props.currentStore ? props.currentStore.id : ''
    }
  },
  fetchPolicy: 'cache-and-network'
});

【讨论】：