Question

query screenshot

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

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

Answer 1

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

使用Apollo Hoc导入

import { withApollo } from 'react-apollo';

使用withApollo

包裹您的组件

const component = withApollo(Component)

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

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(...)
}

此处有更多信息：https://www.apollographql.com/docs/react/api/react-apollo.html#withApollo

调用Apollo Client的GraphQL查询

1 个答案: