调用Apollo Client的GraphQL查询
invoking Query of GraphQL of Apollo Client
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。谁知道如何在事件中调用带参数的查询,例如我想在用户单击按钮时触发带参数的查询。
要在事件中而不是在高阶组件中调用查询,您应该:
使用 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(...)
}
更多信息在这里:https://www.apollographql.com/docs/react/api/react-apollo.html#withApollo
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。谁知道如何在事件中调用带参数的查询,例如我想在用户单击按钮时触发带参数的查询。
要在事件中而不是在高阶组件中调用查询,您应该:
使用 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(...)
}
更多信息在这里:https://www.apollographql.com/docs/react/api/react-apollo.html#withApollo