如何使用阿波罗图形库执行多个查询？

Question

我正在编写一个web应用程序，我需要查询阿波罗的本地状态以及远程API。阿波罗graphql HOC不允许发送多个查询，但提供了一些compose功能。但是@apollo/react-hoc包似乎没有它。不幸的是，将本地状态请求写入远程请求不起作用(根据DevTools，请求是发送的，但没有提供数据)。Redux的compose无论如何都没有帮助(我很清楚为什么会这样)。在没有反应钩子的情况下，解决这个问题的最佳方法是什么？

Answer 1

根据@阿波罗/react 文档的说法，似乎您可以通过在另一个内部嵌套来运行多个查询。

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

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

看起来太冗长了。因此，recompose的(本质上是redux) compose将帮助您：

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

说实话，这种方法(使用compose)是在他们的文档中描述的，但由于它位于描述config的中间位置，所以我认为最好在这里提供示例，供任何人在搜索主题时找到。