Prisma、GraphQL 和 Apollo 中具有突变的数据关系和连接类型

Posted 2023-03-08

【中文标题】Prisma、GraphQL 和 Apollo 中具有突变的数据关系和连接类型

【英文标题】：Data Relationships and Connection Types with Mutations in Prisma, GraphQL, and Apollo

【发布时间】：2020-07-02 02:56:35

【问题描述】：

抱歉，帖子太长了，但我尽量写得详细些。

如何编辑我当前的模型、架构和解析器，以便能够通过网络表单将相关类型（供应商）保存/连接到我创建的类型（项目）？

我想创建一个库存项目并选择一个与该项目关联的供应商。

我有一个这样的 Prisma 数据模型（为了简单起见，我还有其他字段，因为我可以轻松保存其他字段；它只是与存在关系的其他类型）...

物品可能有也可能没有与之关联的供应商。供应商可能有也可能没有当前与其关联的项目列表。

type Item 
  id: ID! @id
  name: String!
  description: String!
  vendor: Vendor


type Vendor 
  id: ID! @id
  items: [Item!]

我有一个这样的 graphql 架构（与本问题末尾的修改架构相比）...

type Mutation 
  createItem(
    name: String! 
    description: String! 
  ): Item!

我的解析器：

async createItem(parent, args, ctx, info) 
  const item = await ctx.db.mutation.createItem(
    
        data: 
            ...args,
        ,
    , info);

    return item;

我的 React 组件包含以下内容：

const CREATE_ITEM_MUTATION = gql`
  mutation CREATE_ITEM_MUTATION(
    $name: String!
    $description: String!
  ) 
    createItem(
      name: $name
      description: $description
    ) 
      id
      name
      description
      vendor 
        id
      
    
  
`;
const ALL_VENDORS_QUERY = gql`
  query ALL_VENDORS_QUERY 
    vendors 
      id
    
  
`;

稍后在我的 html 表单中浏览网页，我有：

<Query query=ALL_VENDORS_QUERY>
  ( data, loading ) => (
    <select
      id="vendor"
      name="vendor"
      onChange=this.handleChange
      value=this.state.vendor
    >
      <option>Vendor</option>
        data.vendors.map(vendor => (
          <option key=vendor.id value=vendor.id>vendor.name</option>
        ))
    </select>
  )
</Query>

我只是不知道如何通过表单提交将供应商与商品联系起来。如果我像这样在解析器中硬编码供应商 ID，我可以让它工作：

async createItem(parent, args, ctx, info) 
  const item = await ctx.db.mutation.createItem(
    
        data: 
            vendor: 
              connect:  id: "ck7zmwfoxg4b70934wx8kgwkx"  // <-- need to dynamically populate this based on user input from the form
            ,
            ...args,
        ,
    , info);

    return item;

...但这显然不是我想要的。

对我来说，像这样修改我的架构是最有意义的：

createItem(
  name: String!
  description: String!
  vendor: Vendor <--- added
): Item!

但是当我这样做时，我得到了这个：

Error: The type of Mutation.createItem(vendor:) must be Input Type but got: Vendor.

如何编辑我当前的模型、架构和解析器，以便能够保存/连接在表单上选择的供应商 ID？

【参考方案1】：

我的问题的答案在这里找到：How to fix 'Variable "$_v0_data" got invalid value' caused from data types relation - Mutation Resolver

我在传递 args (...args) 的同时还传递了 vendor 参数。

这是我更新的突变：

createItem(
    name: String!
    description: String!
    vendorId: ID
    ): Item!

及其解析器：

async createItem(parent, name, description, vendorId, ctx, info) 
  const item = await ctx.db.mutation.createItem(
    
        data: 
            vendor: 
              connect:  id: vendorId 
            ,
            name,
            description,
        ,
    , info);

    return item;

轰隆隆！ ?