前端技术之:如何Mock GraphQL接口数据
// 第一步:引入所依赖的库
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接口数据的更多相关文章
- 前端模拟(mock)接口数据(koa)
在前后端分离开发项目时,经常会有前后端进度不一致,可能前端界面开发已经完成,就等接口了,如果等接口出来再联调的话时间可能会来不及. 这个时候,前端就可以根据制定好的接口规范和接口文档来mock接口数据 ...
- vue mock 模拟接口数据
日常总结 希望能帮到大家 1 mock/sever.js //创建服务 let http=require('http') let fs=require('fs') let url=require(' ...
- 【ALB技术笔记】基于多线程方式的串行通信接口数据接收案例
基于多线程方式的串行通信接口数据接收案例 广东职业技术技术学院 欧浩源 1.案例背景 在本博客的<[CC2530入门教程-06]CC2530的ADC工作原理与应用>中实现了电压数据采集的 ...
- Mock接口数据 = mock服务 + iptable配置
一.mock接口数据应用场景: 1.测试接口A,A接口代码中调用其他服务的B接口,由于开发排期.测试环境不通等原因,依赖接口不可用 2.测试异常情况,依赖接口B返回的数据格式不对.返回None.超时等 ...
- 2019年一半已过,这些大前端技术你都GET了吗?- 下篇
在上一篇文章中已经介绍了大前端关于状态管理.UI组件.小程序.跨平台和框架层的内容.在本文中,我会继续介绍编程语言.工程化.监控.测试和服务端,同时也会对下半年大前端可以关注的部分进行展望. 结合个人 ...
- 解密国内BAT等大厂前端技术体系-美团点评之上篇(长文建议收藏)
引言 进入2019年,大前端技术生态似乎进入到了一个相对稳定的环境,React在2013年发布至今已经6年时间了,Vue 1.0在2015年发布,至今也有4年时间了. 整个业界在前端框架不断迭代中,也 ...
- web前端技术体系大全
一.前端技术框架 1.Vue.js 官网:https://cn.vuejs.org/ Vue CLI:https://cli.vuejs.org/ 菜鸟教程:http://www.runoob.com ...
- Web前端技术体系大全搜索
一.前端技术框架 1.Vue.js 官网:https://cn.vuejs.org/ Vue CLI:https://cli.vuejs.org/ 菜鸟教程:http://www.runoob.com ...
- 解密国内BAT等大厂前端技术体系-阿里篇(长文建议收藏)
进入2019年,大前端技术生态似乎进入到了一个相对稳定的环境,React在2013年发布至今已经6年时间了,Vue 1.0在2015年发布,至今也有4年时间了. 整个业界在前端框架不断迭代中,也寻找到 ...
随机推荐
- mysql 链接数满了的错误 ERROR 1040 (HY000): Too many connections
mysql 链接数满了的错误 ERROR 1040 (HY000): Too many connections 第一种处理方式: ./mysql -u root -p 登录成功后执行以下语句查询当前的 ...
- R_Studio(学生成绩)对两个班级学生成绩进行集合,重新计算学生综合测评成绩并对学生按综合测评成绩进行排名
对成绩表"11_1_1.csv" "11_2_1.csv"进行集成,并重新计算4门课程的平均分为综合测评,增加“排名”属性,并按排名排序 "11_1_ ...
- R_Studio(贷款)数据规范化处理[最小-最大规范化、零-均值规范化、小数定标规范化]
农场申请贷款.csv 对“农场申请贷款.csv”中农场大小.降雨量.农场质量.农场收入进行数据规范化处理 行数[4 5 6 7] “农场申请贷款.csv”中存在缺失值,已对数据进行预处理 setwd( ...
- python虚环境
有的项目使用tornado框架比较好,有的用Django框架比较好,容易发生冲突,这个时候可以建立一个虚拟的python环境. 安装virtualenv包 进入项目所在目录,执行命令 virtuale ...
- 分布式-信息方式-ActiveMQ静态网络连接多线程的consumer(消费者)访问集群
操作如下: 1:把整个conf文件夹复制一份,比如叫做conf22:修改里面的 activemq.xml文件(1)里面的 brokerName不能跟原来的重复(2)数据存放的文件名称不能重复,比如:& ...
- [前端][自定义DOM事件]不使用setTimeout实现双击事件或n击事件
使用setTimeout实现双击事件 例如,这样: let div = document.getElementById("div"); doubleClick(div, funct ...
- C++入门经典-例4.3-函数的递归调用之汉诺塔问题
1:代码如下: // 4.3.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include <iostream> using ...
- Scrum立会报告+燃尽图 02
本次作业要求参见:https://edu.cnblogs.com/campus/nenu/2019fall/homework/9912 一.小组情况组长:贺敬文组员:彭思雨 王志文 位军营 徐丽君队名 ...
- sql server中 设置与查看锁的超时时间(ZT) @@LOCK_TIMEOUT
在数据库的应用系统中,死锁是不可避免的.通过设置死锁的处理优先级方法,可以在数据库引擎中自动检测到死锁,对发生的死锁会话进行干预,从而达到解除死锁的目点,但在这种情况下,会话只能被动的等待数据库引 ...
- python 逻辑运算符and or
Python中逻辑运算符与C.C++.Golang等语言不太一样. 简单记录下. 1. 都是真或第一个真,第二个假 >>> a = 1 >>> b = 2 > ...