美文网首页
GraphQL入门之变更输入类型

GraphQL入门之变更输入类型

作者: kongxx | 来源:发表于2024-03-20 09:31 被阅读0次

    前一篇文章介绍了变更操作,在创建 User 对象的时候,只传递了 name 和 email 参数,但是如果属性太多或者创建对象的时候只需要部分必选参数,直接把属性都当成参数就不合适了,这里 GraphQL 提供了 Input Type 参数来解决这个问题。下面看个例子。

    创建 Node.js 的工程

    mkdir myapp
    cd myapp
    npm init (一路回车)
    

    安装依赖包

    npm install @apollo/server graphql
    

    定义 Schema

    创建 schema.graphql 文件,内容如下:

    type User {
        id: ID!
        name: String!
        email: String!
    }
    
    type Query {
        users: [User],
    }
    
    input UserInput {
      name: String!
      email: String!
    }
    
    type Mutation {
      createUser(user: UserInput!) : User!
    }
    
    schema {
      query: Query
      mutation: Mutation
    }
    

    schema 文件主要包括:

    1. 新增了输入参数 UserInput 的定义,作为演示只包含两个参数 name 和 email。
    2. 修改变更操作不再使用 name 和 email 作为参数,而是改成使用输入参数 UserInput。

    实现处理器

    创建 resolvers.js 文件,内容如下:

    const user1 = {id: 1, name: 'user1', email: 'user1@gmail.com'};
    const user2 = {id: 2, name: 'user2', email: 'user2@gmail.com'};
    const user3 = {id: 3, name: 'user3', email: 'user3@gmail.com'};
    const users = [user1, user2, user3];
    
    const resolvers = {
      Query: {
        users: () => users,
      },
    
      Mutation: {
        createUser(obj, args, context, info) {
          let user = {id: users.length + 1,name: args.user.name, email: args.user.email};
          users.push(user);
          return user;
        }
      }
    };
    
    module.exports = resolvers;
    

    处理器函数有些变化,主要就是 args 里不直接使用 name 和 email 属性,而是通过 args 中的 user 对象来间接使用。

    主程序

    创建 server.js 文件,内容如下:

    const { ApolloServer } =  require('@apollo/server');
    const { startStandaloneServer } = require('@apollo/server/standalone');
    const fs = require("fs");
    
    const typeDefs = fs.readFileSync('./schema.graphql').toString();
    const resolvers = require('./resolvers');
    
    const server = new ApolloServer({
      typeDefs,
      resolvers,
    });
    
    startStandaloneServer(server).then(function(data) {
      console.log(`🚀 Server ready at ${data.url}`);
    });
    

    测试

    启动服务

    node server.js
    

    服务启动后,访问 http://localhost:4000 进行测试。

    变更操作

    变更请求

    mutation createUser($user: UserInput!) {
      createUser(user: $user) {
        id,
        name,
        email
      }
    }
    

    变更参数

    {
      "user": {
        "name": "newuser",
        "email": "newuser@gmail.com"
      }
    }
    

    操作结果

    {
      "data": {
        "createUser": {
          "id": "4",
          "name": "newuser",
          "email": "newuser@gmail.com"
        }
      }
    }
    

    相关文章

      网友评论

          本文标题:GraphQL入门之变更输入类型

          本文链接:https://www.haomeiwen.com/subject/fpkxtjtx.html