接口测试平台代码实现103:GraphQL-3

上节我们搞定了首页的GraphQL请求功能，但是似乎漏掉了一个功能：显示。也就是当我点击左侧请求记录的时候，右侧需要显示对应的请求数据，但是很显然我们遗漏了GraphQL这个请求体类型。

打开Home.html：找到这段代码：

我们现在来添加上：

然后就可以成功显示了。

正文开始：

本节我们来快速搞定接口库调试层，相较于首页，这里涉及的不但要有显示，发送功能，还有保存功能。

首先我们打开接口库的html，在dom层(你可以理解为<标签>部分)进行创建表情，大部分原理和代码我们可以复制首页的对应部分。

打开P_apis.html:

首先增加这句：

有同学经常搞不懂这句插入的具体位置，其实这里可以通过上下文的关键字来ctrl+f来寻找。这是程序员基本功哦～

效果如下：

然后我们再去写他的子页面：

效果如下：

我们试着输入，结果发现输入的东西都看不见，那是因为颜色都是白色，我们这里要加个文字颜色属性：

现在能正常输入显示了。

然后我们找到 显示，保存和发送函数，分别添加 graphql的部分。

首先是显示：

显示写完了，现在我也不确定这段代码对不对。毕竟我们是直播开发，假如后面不小心发现写错了，我也不会来这改好，然后装作没出错的样子。因为教程中代码的截图比较连贯，来回跳跃改容易引起叉劈。大家也经历一下真实的流程，很接地气很安心。

然后是发送：

然后是保存：

经过测试：三个函数全部成功了～

然后我们去修改views.py中，加上相应的代码：

找到函数 Api_send()

如图，到这，就算搞定了接口库调试层的部分了。

大家可以自行简单测试，bug请迅速留言或反馈哦～

下节课我们要搞定用例库的步骤相关，那里要更复杂一些，需要增加请求体的替换部分设计。