reactjs - 如何使用 Apollo graphql HOC 执行多个查询？

Question

我正在编写一个网络应用程序，我需要查询 Apollo 的本地状态以及远程 API。Apollo graphqlHOC 不允许发送多个查询，但提供了一些compose功能。但似乎该@apollo/react-hoc包没有它。不幸的是，将本地状态请求编写成远程状态请求不起作用（根据 DevTools，请求已发送，但未提供数据）。Reduxcompose无论如何都无济于事（好吧，我很清楚为什么会这样）。在没有React 钩子的情况下解决这个问题的最佳方法是什么？

Answer 1

根据@apollo/react-hoc文档，您似乎可以通过将一个查询嵌套在另一个查询中来运行多个查询。

默认情况下graphql，钩子将数据作为data道具注入，因此对于多个查询，如果没有额外的配置，它将无法工作。config.name来救援，因此您可以为注入的道具指定不同的名称，而不是data.

export default(
  graphql(
    query1, 
    {name: "data1"}
  )(
    graphql(
      query2, 
      {name: "data2"}
    )(YourComponent)
  )
)

看起来太冗长了。So recompose's（本质上是 redux）compose会帮助你：

export default compose(
  graphql(query1, {name: "data1"}),
  graphql(query2, {name: "data2"})
)(YourComponent);

说实话，这种方法（with compose）在他们的文档中有所描述，但由于它位于描述的中间位置config，我相信最好将示例放在这里供任何人在搜索主题时找到。