前言
上一节我们学习了GraphQL的一些基础知识,本文继续深入研究,从对比的角度来切入,方便读者理解.
Mutation
在GraphQL中,只有两种类型的操作,就是queries 和 mutations.
如果说query类似于REST中的GET操作,那么Mutation就好比REST中的DELETE, PUT,PATCH方法,笔者用一句简单的话来概括一下:
query用来查询服务端的数据,而mutation用来修改服务端的数据
Mutation例子
假设有个宠物店的应用采用了GraphQL API。
获取所有宠物的query可能如下:
query GetAllPets { pets { name petType } }
添加新宠物的mutation开起来是这样的:
# String! ---> !表示这个变量是必须的 mutation AddNewPet ($name: String!, $petType: PetType) { addPet(name: $name, petType: $petType) { id name petType } }
AddNewPet mutation预期得到name和petType变量的值,其请求的数据类似下面这样:
{ "name": "Rover", "petType": "DOG" }
mutation的响应中有类似下面这样的数据:
{ "data": { "addPet": { "id": 1 "name": "Wang Cai", "petType": "DOG" } } }
mutation和query对比
相同点(类似点)
Mutation和query的结构看起来非常类似,GraphQL操作结构一般如下所示:
不同点
mutation和query之间的一个真正区别是操作类型,query用于查询,mutation用于增/删/改数据
另外一个注意点:
在AddNewPet示例中,mutation的名称是addPet.
# String! ---> !表示这个变量是必须的 mutation AddNewPet ($name: String!, $petType: PetType) { addPet(name: $name, petType: $petType) { id name petType } }
这意味着在 GraphQL API 类型定义中,有这么一个字段,如下所示:
type Mutation { addPet (name: String!, petType: PetType): AddPetResult! }
服务器端配置
来看一个例子,使用了一个能够和petsAPI数据源(data source)进行的连接来添加一个新的宠物。
#这里是一个异步操作 const resolvers = { ... Mutation: { addPet: async (root, args, context) => { const { name, petType } = args; const newPet = await context.dataSources.petsAPI.addPet({ name, petType }) return { id: newPet.id, name, petType } } } };
返回值
mutation也返回数据,这是mutation和query另一个相似之处。但是,mutation通常只返回创建的相关新数据。