如何在一个突变中创建嵌套节点? [英] How to create nested nodes in one mutation?

问题描述

我正在尝试在 https://www.graph.cool/ db上写数据有突变. 我的项目是一个React Web应用程序，我使用Apollo作为graphql客户端，并使用graphql-tag npm包作为模板文字解析器.

Hi I am trying to write data on my https://www.graph.cool/ db with a mutation. My project is a React web-app and I am using Apollo as graphql client and graphql-tag npm package as template literal parser.

问题是我不知道如何为带有嵌套数据的正确突变安排gql模板字符串. 我的架构如下所示，例如，请注意类型公司"的地址"字段是地址"对象类型的数组.

The problem is that i don't know how to arrange the gql template string for the correct mutation with nested data. My schema looks like this, for example note the field "Addresses" for the type "Company" is an array of "Address" objects type.

type Company {
  name: String!
  website: String
  Owner: User
  Addresses: [Addresses]
}

type User {
  name: String!
  email: String
}

type Address {
  street: String!
  city: String!
  country: String
  contacts: [Contact]
}

type Contact {
  name: String
  email: String
  phone: String
}

例如，我想一次创建一个新公司，新所有者和多个地址.对于地址，我还需要创建一个新联系人.

For example, I want to create a new company, its new owner and multiple addresses at the same time in one mutation. For the addresses I need to create a new contact as well.

推荐答案

您可以利用我们所谓的嵌套突变来完成此任务. 首先，让我们看看如何在GraphiQL游乐场中做到这一点:

You can make use our so called nested mutations to accomplish that. First of all, let's see how we can do it from the GraphiQL playground:

mutation createNestedCompany {
  createCompany(
    owner: {
      name: "Mickey"
      email: "[e-mail]"
    }
    addresses: [{
      street: "A street"
      city: "A city"
      country: "A country"
      contacts: [{
        name: "Mickey"
        email: "[e-mail]"
        phone: "[phone]"
      }]
    }, {
      street: "B street"
      city: "B city"
      country: "B country"
      contacts: [{
        name: "Minney"
        email: "[e-mail]"
        phone: "[phone]"
      }]
    }]
  ) {
    id
    owner {
      id
    }
    addresses {
      id
      contacts {
        id
      }
    }
  }
}

请注意，createCompany变异具有对象自变量owner和列表对象自变量addresses. addresses具有嵌套的contacts列表对象参数.

Note that the createCompany mutation has the object argument owner and the list object argument addresses. addresses has a nested contacts list object argument.

使用Apollo Client，我们使用GraphQL变量指定输入参数，因此让我们看一下这种情况下的外观:

Using Apollo Client, we specify input arguments with GraphQL variables, so let's see how it looks in this case:

const createNestedCompany = gql`
  mutation createNestedCompany(
    $owner: CompanyownerUser
    $addresses: [CompanyaddressesAddress!]
  ) {
    createCompany(
      owner: $owner
      addresses: $addresses
    ) {
      id
      owner {
        id
      }
      addresses {
        id
        contacts {
          id
        }
      }
    }
  }
`

当使用Apollo调用变异时，我们现在必须将变量指定为对象:

When calling the mutation with Apollo, we now have to specify the variables as an object:

const variables = {
  owner: {
    name: "Mickey"
    email: "[e-mail]"
  }, 
  addresses: [{
    street: "A street"
    city: "A city"
    country: "A country"
    contacts: [{
      name: "Mickey"
      email: "[e-mail]"
      phone: "[phone]"
    }]
  }, {
    street: "A street"
    city: "A city"
    country: "A country"
    contacts: [{
      name: "Minney"
      email: "[e-mail]"
      phone: "[phone]"
    }]
  }]
}

并使用变量调用突变:

this.props.createNestedCompany({ variables })
  .then((response) => {
    console.log('Company, owner and addresses plus contacts created');
  }).catch((e) => {
    console.error(e)
  })

变量类型CompanyownerUser和[CompanyaddressesAddress!]取决于多重性(一对一；一对多)，相关模型(和User; Company和Address)和相关字段(owner; addresses).导航到createCompany突变时，您可以在GraphiQL游乐场文档中找到所有类型名称.

The variable types CompanyownerUser and [CompanyaddressesAddress!] depend on a combination of the multiplicity (to-one; to-many), the related models (Company and User; Company and Address) and the related fields (owner; addresses). You can find all type names in the GraphiQL playground docs when you navigate to the createCompany mutation.

这篇关于如何在一个突变中创建嵌套节点?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！