// 第一步:引入所依赖的库
const { makeExecutableSchema, addMockFunctionsToSchema } = require('graphql-tools');
const { graphql } = require('graphql');

// 第二步:定义GraphQL Schema
const schemaString = `
type User {
id: ID,
name: String,
age: Int,
address: String
}
type Query {
user: User
}
`;
// 样例数据
const user = { id: 1, name: 'zhang' };

// 第三步:定义Resolver
const resolvers = {
Query: {
user: () => user
}
};

// 第四步:调用makeExecutableSchema函数生成Schema对象
const schema = makeExecutableSchema({ typeDefs: schemaString, resolvers });

// 第五步:也是重要的一步,调用addMockFunctionsToSchema函数mock Schema
addMockFunctionsToSchema({
schema,
mocks: {
Int: () => 6,
Float: () => 22.1,
String: () => 'Hello'
}
});

// 第六步:也是最后一步,查询并验证结果
const query = `
query tasksForUser {
user {
id,
name,
age,
address
}
}
`;
graphql(schema, query).then(result => console.log('Got result', result));

// 参考资料网址: https://www.apollographql.com/docs/graphql-tools/mocking/

前端技术之:如何Mock GraphQL接口数据的更多相关文章

  1. 前端模拟(mock)接口数据(koa)

    在前后端分离开发项目时,经常会有前后端进度不一致,可能前端界面开发已经完成,就等接口了,如果等接口出来再联调的话时间可能会来不及. 这个时候,前端就可以根据制定好的接口规范和接口文档来mock接口数据 ...

  2. vue mock 模拟接口数据

    日常总结 希望能帮到大家 1 mock/sever.js  //创建服务 let http=require('http') let fs=require('fs') let url=require(' ...

  3. 【ALB技术笔记】基于多线程方式的串行通信接口数据接收案例

    基于多线程方式的串行通信接口数据接收案例 广东职业技术技术学院  欧浩源 1.案例背景 在本博客的<[CC2530入门教程-06]CC2530的ADC工作原理与应用>中实现了电压数据采集的 ...

  4. Mock接口数据 = mock服务 + iptable配置

    一.mock接口数据应用场景: 1.测试接口A,A接口代码中调用其他服务的B接口,由于开发排期.测试环境不通等原因,依赖接口不可用 2.测试异常情况,依赖接口B返回的数据格式不对.返回None.超时等 ...

  5. 2019年一半已过,这些大前端技术你都GET了吗?- 下篇

    在上一篇文章中已经介绍了大前端关于状态管理.UI组件.小程序.跨平台和框架层的内容.在本文中,我会继续介绍编程语言.工程化.监控.测试和服务端,同时也会对下半年大前端可以关注的部分进行展望. 结合个人 ...

  6. 解密国内BAT等大厂前端技术体系-美团点评之上篇(长文建议收藏)

    引言 进入2019年,大前端技术生态似乎进入到了一个相对稳定的环境,React在2013年发布至今已经6年时间了,Vue 1.0在2015年发布,至今也有4年时间了. 整个业界在前端框架不断迭代中,也 ...

  7. web前端技术体系大全

    一.前端技术框架 1.Vue.js 官网:https://cn.vuejs.org/ Vue CLI:https://cli.vuejs.org/ 菜鸟教程:http://www.runoob.com ...

  8. Web前端技术体系大全搜索

    一.前端技术框架 1.Vue.js 官网:https://cn.vuejs.org/ Vue CLI:https://cli.vuejs.org/ 菜鸟教程:http://www.runoob.com ...

  9. 解密国内BAT等大厂前端技术体系-阿里篇(长文建议收藏)

    进入2019年,大前端技术生态似乎进入到了一个相对稳定的环境,React在2013年发布至今已经6年时间了,Vue 1.0在2015年发布,至今也有4年时间了. 整个业界在前端框架不断迭代中,也寻找到 ...

随机推荐

  1. Python3学习笔记(十):赋值语句和布尔值

    一.赋值语句 1.序列解包 多个赋值同时进行: >>> x,y,z = 1, 2, 3 >>> print(x, y, z) 1 2 3 变量交换: >> ...

  2. UE4 使用VaRest的最佳实践

    背景介绍: 用Node.js,express,Mongo搭建了一个简单后台,为项目提供REST风格的API服务. 第一个查询是通过Get进行,返回一个json字符串. 在虚幻里使用VaRest来进行访 ...

  3. C++入门经典-例3.1-判断输入的数字是否为奇数

    1:代码如下: // 3.1.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include <iostream> using ...

  4. tensorflow实现迁移学习

    此例程出自<TensorFlow实战Google深度学习框架>6.5.2小节 卷积神经网络迁移学习. 数据集来自http://download.tensorflow.org/example ...

  5. HiddenField Class

    HiddenField Class Namespace: System.Web.UI.WebControls Assembly: System.Web.dll Represents a hidden ...

  6. SQL Server2016 AlwaysOn无域高可用

    https://blog.csdn.net/qq_41981651/article/details/90314817 https://blog.csdn.net/roven257/article/de ...

  7. adb自动化农药金币

    本贴仅为记录贴 记录adb 的环境配置及python脚本的交互 1.adb 的下载 通过搜索adb工具即可下载,这里提供一个共享地址https://pan.baidu.com/s/103ix26tZy ...

  8. windows7解决无法桌面远程

    正常设置远程连接一般需要下面几个设置: 1).查询并记录远程计算机的IP,开始——运行——输入cmd,回车,在cmd界面输入ipconfig/all 回车查看IPv4地址 2).被远程的电脑设置一个用 ...

  9. java:容器/集合Collection(List(ArrayList,LinkedList,Vector),Set(HashSet(LinkedHashSet),TreeSet))

    /** * Collection接口  不唯一,无序 * 常用的方法: * add(Object e) 确保此 collection 包含指定的元素(可选操作). * size():获取集合中元素的个 ...

  10. 清晰理解redux中的

    首先需要明白 Redux 的单一状态树的概念,所谓的单一状态树,就是指“所有的 state 都以一个对象树的形式储存在一个单一的 store 中.” 比如我们有这么一个状态树(或者你叫它状态对象也行) ...