调用 Apollo Client 的 GraphQL 查询答案

【问题标题】：invoking Query of GraphQL of Apollo Client调用 Apollo Client 的 GraphQL 查询
【发布时间】：2018-02-10 00:48:55
【问题描述】：

query screenshot

const allTeamApplicants = gql`
  query ($id: ID!) {
    allApplicants(filter: { user: { id: $id } }) {
      id
      firstName
      lastName
      appliedPosition
      applicationStage
      isFormFilled
      isContractSigned
      email
      phoneNumber
}

我在 React Web 应用程序中使用 Apollo Client for GraphQL。任何人都知道如何在事件中使用参数调用查询，例如，我想在用户单击按钮时使用参数触发查询。

【问题讨论】：

标签： reactjs graphql react-apollo

【解决方案1】：

要在事件中调用查询，而不是在高阶组件中调用，您应该：

使用 Apollo Hoc 导入

import { withApollo } from 'react-apollo';

用withApollo包装你的组件

const component = withApollo(Component)

在您的组件中，您将收到一个名为client 的新道具，您可以将其用作 Promise，例如：

function eventHandler(idParam) {
  client.query({
    query: gql`
      query ($id: ID!) {
        allApplicants(filter: { user: { id: $id } }) {
          id
          firstName
          lastName
          appliedPosition
          applicationStage
          isFormFilled
          isContractSigned
          email
          phoneNumber
        }
      }`,
      variables: {
        // set the variables defined in the query, in this case: query($id: ID!)
        id: idParam 
      }
    }
  })
  .then(...)
  .catch(...)
}

【讨论】：

在 .then(response => response) 中，我似乎将响应包装在另一个 Promise 中，这证明很难解决。有什么想法吗？
@Stefano then 函数参数应该只是一个包含查询结果的对象。类似：response.queryName