[英]Data Relationships and Connection Types with Mutations in Prisma, GraphQL, and Apollo
Sorry for the long post, but I tried to be as detailed as possible.很抱歉这篇文章很长,但我试图尽可能详细。
How can I edit my current model, schema, and resolver to be able to save/connect a related type (Vendor) to my created type (Item) via a web form?如何编辑我当前的模型、架构和解析器,以便能够通过 Web 表单将相关类型(供应商)保存/连接到我创建的类型(项目)?
I want to create an inventory item and select a vendor to be associated with that item.我想创建一个库存项目并选择一个与该项目相关联的供应商。
I have a Prisma data model like so (I've other fields for simplicity because I have no trouble saving the other fields; it's just with other types where there is a relation)...我有一个像这样的 Prisma 数据模型(为了简单起见,我还有其他字段,因为我可以轻松保存其他字段;它只是与存在关系的其他类型)...
Items may or may not have a vendor associated with them.项目可能有也可能没有与其相关联的供应商。 Vendors may or may not have a list of items currently associated with them.供应商可能有也可能没有当前与其关联的项目列表。
type Item {
id: ID! @id
name: String!
description: String!
vendor: Vendor
}
type Vendor {
id: ID! @id
items: [Item!]
}
I have a graphql schema like this (compare to modified schema at the end of this question)...我有一个这样的 graphql 模式(与此问题末尾的修改后的模式相比)...
type Mutation {
createItem(
name: String!
description: String!
): Item!
}
My resolver:我的解析器:
async createItem(parent, args, ctx, info) {
const item = await ctx.db.mutation.createItem(
{
data: {
...args,
},
}, info);
return item;
}
My React component contains the following:我的 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
}
}
`;
Later on down the web page in my HTML form, I have:后来在我的 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>
I just don't know how to connect the vendor to the item through a form submission.我只是不知道如何通过表单提交将供应商连接到项目。 I can get it working if I hard code the vendor id in my resolver like so:如果我在解析器中对供应商 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;
}
...but that obviously is not what I want. ……但这显然不是我想要的。
To me, it makes the most sense to modify my schema like so:对我来说,像这样修改我的架构是最有意义的:
createItem(
name: String!
description: String!
vendor: Vendor <--- added
): Item!
But when I do that I get this:但是当我这样做时,我得到了这个:
Error: The type of Mutation.createItem(vendor:) must be Input Type but got: Vendor.
How can I edit my current model, schema, and resolver to be able to save/connect a vendor ID that is selected on the form?如何编辑我当前的模型、架构和解析器,以便能够保存/连接在表单上选择的供应商 ID?
The answer to my problem was found here: How to fix 'Variable "$_v0_data" got invalid value' caused from data types relation - Mutation Resolver我的问题的答案在这里找到: 如何修复由数据类型关系引起的“变量“$_v0_data”得到无效值 - Mutation Resolver
I was spreading the args (...args) while also passing the vendor argument.我在传播 args (...args) 的同时还传递了供应商参数。
Here is my updated mutation:这是我更新的突变:
createItem(
name: String!
description: String!
vendorId: ID
): Item!
and its resolver:及其解析器:
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;
}
Boom!繁荣! 💥 💥
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.