Question

Apollo-Client 2.0。我正在使用链接的Mutation组件。我正在尝试将第一个Mutation的返回值传递给第二个Mutation。当在表单组件上单击onSubmit按钮时，我执行突变。第一次突变返回的值未作为第二次突变的“变量”之一传递。

我在两个非常相似的帖子中回顾了解决方案：How to wrap GraphQL mutation in Apollo client mutation component in React和How to chain together Mutations in apollo client。我认为我对表单的使用使解决方案更加复杂。尽管传递的值（competitionId）在handleOnSubmit函数中可见（如果我在handleOnSubmit中的createCompetition（）之后进行控制台日志），则它不会作为在handleOnSubmit中调用的第二个Mutation中的变量传递。结果是成功执行了第一个突变，第二个突变成功执行了400个错误：未提供所需类型为“ ID！\”的“错误”：[{“消息”：“变量\“ $ competitionId \”。 ”具体来说，当第一个突变运行后，CompetitionId的值会传递给第二个突变，但不会作为“变量”传递给作为参数传递给handleOnSubmit的createMatch函数。看起来，与createMatch函数一起传递给handleOnSubmit的“变量”仅包含单击提交按钮时可用的变量。点击了提交按钮后，communityId生成，并且第一个突变将其返回。

handleOnSubmit = async(event, createCompetition, createMatch) => {
event.preventDefault();
await createCompetition();
await createMatch();
this.clearState();
this.props.history.push('/home');

}

render () {
const {location, name, action, caliber, rifleName, dateOf,competitionScore} = this.state;
const { matchNumber, targetNumber, relay, distanceToTarget, matchScore} = this.state;
return (
<div className="App">
  <h2 className="App">Add Competition</h2>
  <Mutation 
    mutation={CREATE_COMPETITION} 
    variables={{location, name, action, caliber, rifleName, dateOf, competitionScore}}
    refetchQueries={() => [
      { query: GET_ALL_COMPETITIONS, variables:{name: name}}
    ]}
    update={this.updateCache}>
    {(createCompetition, {data, loading, error}) => {

      if(loading) return <div>loading competition...</div>
      if(error) return <div>error: {error}</div>
      let competitionId;
      if(data) {
        competitionId = data.createCompetition._id;
      }
      return (
        <Mutation
          mutation={CREATE_MATCH}
          variables={{competitionId, matchNumber, targetNumber, distanceToTarget, matchScore}}>
          {(createMatch, {_, loading, error}) => {
            if(loading) return <div>loading match...</div>
            return (
              <form 
                className="form" 
                onSubmit={event => this.handleOnSubmit (event, createCompetition, createMatch)}>
                <label>  remaining form deleted for brevity

我希望将CompetitionId的值作为变量传递给在handleOnSubmit方法中调用的createMatch函数。没有提供。

Answer 1

您似乎需要的是嵌套突变：thinkingface;

问：您使用的是吗？

好吧，在GraphQL中，您可以通过单个突变来创建节点，如果您的Types是相关的，这非常简单，所以我认为这是您的情况。

应该看起来像这样：

datamodel.graphql

type Competition {
  id: ID! @unique
  name: String!
  match: Match! @relation(name: "CompetitionMatch")
}

type Match {
  id: ID! @unique
  name: String!
  campetition: Competition! @relation(name: "CompetitionMatch")
}

因此，现在您的schema.graphql应该如下所示：

type Mutation {
  createCompetition (name: String! match: MatchInput): Competition
}

input MatchInput {
  name: String!
}

现在，当您调用createCompetition突变时，您必须发送匹配数据，如下所示：

mutation createCompetition (
 name: 'Loremp competition'
 match: { name: 'child match'}
) {
 id
 name
 match {
  id
  name
 }
}

参考：https://www.graph.cool/docs/reference/graphql-api/mutation-api-ol0yuoz6go/#nested-create-mutations

希望获得帮助！

致谢

Answer 2

如果（数据）在哪里，则应该返回第二个突变

如何在使用表单组件时链接Apollo客户端中的突变

2 个答案: