在本章中,无涯教程将学习GraphQL中的Mutation查询。
Mutation查询会修改数据存储区中的数据并返回一个值。它可以用于插入,更新或删除数据。
下面是Mutation查询的语法-
mutation{ someEditOperation(dataField:"valueOfField"):returnType }
让无涯教程了解如何使用Mutation查询将新的学生记录添加到数据存储中。
通过名称mutation-app创建一个项目文件夹。从终端将目录更改为mutation-app。请按照"环境设置"一章中介绍的步骤3至5进行操作。
在项目文件夹mutation-app中添加 schema.graphql 文件,并添加以下代码-
type Query { greeting:String } type Mutation { createStudent(collegeId:ID,firstName:String,lastName:String):String }
请注意,函数createStudent返回String类型。这是创建学生后生成的唯一标识符(ID)。
在项目文件夹中创建一个文件resolvers.js并添加以下代码-
const db=require('./db') const Mutation={ createStudent:(root,args,context,info) => { return db.students.create({collegeId:args.collegeId, firstName:args.firstName, lastName:args.lastName}) } } const Query={ greeting:() => "hello" } module.exports={Query,Mutation}
Mutation函数指向数据存储区中的学生集合。要添加新的学生,请在学生集合中调用create方法。 args 对象将包含在查询中传递的参数。 students 集合的create方法将返回新创建的学生对象的ID。
创建一个 server.js 文件。请参阅"环境设置"一章中的步骤8。在终端中执行命令npm start。服务器将启动并在9000端口上运行。在这里,使用GraphiQL作为客户端来测试应用程序。
下一步是打开浏览器并输入URL http://localhost:9000/graphiql 。在编辑器中键入以下查询-
链接:https://www.learnfk.comhttps://www.learnfk.com/graphql/graphql-mutation.html
来源:LearnFk无涯教程网
//collegeId 应与来自colleges.json 的数据相匹配,以便于检查询 mutation { createStudent(collegeId:"col-2",firstName:"Tim",lastName:"George") }
上面的查询将在student.json文件中创建一个Student对象 。查询将返回唯一的标识符。查询的响应如下所示-
{ "data": { "createStudent": "SkQtxYBUm" } }
要验证是否创建了学生对象 ,可以使用studentById查询。您也可以从数据文件夹中打开students.json文件以验证ID。
要使用studentById查询,请按如下所示编辑 schema.graphql -
type Query { studentById(id:ID!):Student } type Student { id:ID! firstName:String lastName:String collegeId:String }
如下所示编辑 resolver.js 文件-
const db=require('./db') const Query={ studentById:(root,args,context,info) => { return db.students.get(args.id); } } const Mutation={ createStudent:(root,args,context,info) => { return db.students.create({collegeId:args.collegeId, firstName:args.firstName, lastName:args.lastName}) } } module.exports={Query,Mutation}
下面给出的是通过Mutation查询返回的唯一ID获取学生的查询-
{ studentById(id:"SkQtxYBUm") { id firstName lastName } }
来自服务器的响应如下-
{ "data": { "studentById": { "id": "SkQtxYBUm", "firstName": "Tim", "lastName":"George" } } }
客户端应用程序想要获取学生和大学的详细信息。可以创建一个返回包含学生及其大学详细信息的对象的查询,而不是发送两个不同的请求。
添加一个名为 addStudent 的新方法,该方法以 schema.graphql 的Mutation类型返回对象 。
让无涯教程学习如何通过学生详细信息访问大学详细信息。在模式文件中添加大学类型。
type Mutation { addStudent_returns_object(collegeId:ID,firstName:String,lastName:String):Student createStudent(collegeId:ID,firstName:String,lastName:String):String } type College { id:ID! name:String location:String rating:Float } type Student { id:ID! firstName:String lastName:String college:College }
更新项目文件夹中的文件 resolvers.js 并添加以下代码-
const Mutation={ createStudent:(root,args,context,info) => { return db.students.create({ collegeId:args.collegeId, firstName:args.firstName, lastName:args.lastName }) }, //新的解析器函数 addStudent_returns_object:(root,args,context,info) => { const id=db.students.create({ collegeId:args.collegeId, firstName:args.firstName, lastName:args.lastName }) return db.students.get(id) } } //对于返回的每个学生对象,都会调用解析器 const Student={ college:(root) => { return db.colleges.get(root.collegeId); } } module.exports={Query,Student,Mutation}
接下来,无涯教程将使用以下代码启动服务器并在GraphiQL中请求查询-
mutation { addStudent_returns_object(collegeId:"col-101",firstName:"Susan",lastName:"George") { id firstName college{ id name } } }
上面的查询添加了一个新学生,并与大学对象一起检索了该学生对象 。这样可以节省往返服务器的时间。
{ "data": { "addStudent_returns_object": { "id": "rklUl08IX", "firstName": "Susan", "college": { "id": "col-101", "name": "AMU" } } } }
祝学习愉快!(内容编辑有误?请选中要编辑内容 -> 右键 -> 修改 -> 提交!)