接口测试平台代码实现32:接口列表备注功能

简介: 接口测试平台代码实现32:接口列表备注功能

备注功能是一个非常非常小的功能,所以我们先迅速处理掉这个备注功能

   让我们制作一个简单的备注输入框和保持/取消按钮,然后用户点击备注按钮就会显示这个输入框+保持/取消按钮。 保持和取消都会让输入框消失,但是保存功能多了一个像后台发送请求的过程,把备注内容给后台保存起来。

所以打开P_apis.html:

新建了这个div备注弹层:

微信图片_20220618190444.png

注意其中有个隐藏的input,这个是用来存储我们打开的接口的id的,以便我们点击保存按钮的时候,系统知道是要保存哪个接口的备注。注意这个div本体也要隐藏,只是为了方便调试,我们在最后才加上隐藏属性。

效果如下:

微信图片_20220618190456.png


然后我们给div加上id和隐藏属性,并写好打开它的函数:open_bz()然后让备注按钮onclick=这个函数。

微信图片_20220618190503.png

微信图片_20220618190511.png微信图片_20220618190516.png

完成之后测试一下,没问题后继续写 保存/取消函数:

取名为:save_bz,close_bz微信图片_20220618190522.png

我们先把取消功能函数close_bz写好:微信图片_20220618190528.png

测试一下么问题后,开始书写save_bz:

注意,这里我们要传入备注内容,也就需要给这个多行文本框加入一个id以便定位bz_value微信图片_20220618190536.png

路由就设置为:/save_bz/

然后我们urls.py微信图片_20220618190545.png

views.py:微信图片_20220618190551.png

然后我们要做到一个效果,就是每当用户打开任意接口的备注时,这个多行文本框都要显示保存好的,而不是一片空白。

所以我们回到P_apis.html中,找到open_bz()函数。

修改成如下:(前面.value不小心写成了.vallue,大家注意下微信图片_20220618190559.png

解释上图:先清空这个文本框,防止用户之前打开了其他接口的备注的内容显示在这个接口上。

然后请求后台,把接口id给过去,等后台返回这个接口的备注后,显示div,存放好id,把返回的备注加载到文本框。


所以我们继续写urls.py,增加一个获取备注映射微信图片_20220618190607.png

views.py:微信图片_20220618190613.png

然后我们重启服务,刷新页面,进行最终测试!

成功后即可等待下一节的难点了。

相关文章
|
12天前
|
消息中间件 监控 小程序
电竞陪玩系统架构优化设计,陪玩app如何提升系统稳定性,陪玩小程序平台的测试与监控
电竞陪玩系统架构涵盖前端(React/Vue)、后端(Spring Boot/php)、数据库(MySQL/MongoDB)、实时通信(WebSocket)及其他组件(Redis、RabbitMQ、Nginx)。通过模块化设计、微服务架构和云计算技术优化,提升系统性能与可靠性。同时,加强全面测试、实时监控及故障管理,确保系统稳定运行。
|
25天前
|
算法 Java 测试技术
使用 BenchmarkDotNet 对 .NET 代码进行性能基准测试
使用 BenchmarkDotNet 对 .NET 代码进行性能基准测试
56 13
|
2月前
|
并行计算 算法 测试技术
C语言因高效灵活被广泛应用于软件开发。本文探讨了优化C语言程序性能的策略,涵盖算法优化、代码结构优化、内存管理优化、编译器优化、数据结构优化、并行计算优化及性能测试与分析七个方面
C语言因高效灵活被广泛应用于软件开发。本文探讨了优化C语言程序性能的策略,涵盖算法优化、代码结构优化、内存管理优化、编译器优化、数据结构优化、并行计算优化及性能测试与分析七个方面,旨在通过综合策略提升程序性能,满足实际需求。
83 1
|
2月前
|
人工智能 供应链 安全
AI辅助安全测试案例某电商-供应链平台平台安全漏洞
【11月更文挑战第13天】该案例介绍了一家电商供应链平台如何利用AI技术进行全面的安全测试,包括网络、应用和数据安全层面,发现了多个潜在漏洞,并采取了有效的修复措施,提升了平台的整体安全性。
|
6天前
|
数据可视化 前端开发 测试技术
接口测试新选择:Postman替代方案全解析
在软件开发中,接口测试工具至关重要。Postman长期占据主导地位,但随着国产工具的崛起,越来越多开发者转向更适合中国市场的替代方案——Apifox。它不仅支持中英文切换、完全免费不限人数,还具备强大的可视化操作、自动生成文档和API调试功能,极大简化了开发流程。
|
6天前
|
存储 测试技术 数据库
接口测试工具攻略:轻松掌握测试技巧
在互联网快速发展的今天,软件系统的复杂性不断增加,接口测试工具成为确保系统稳定性的关键。它如同“翻译官”,模拟请求、解析响应、验证结果、测试性能并支持自动化测试,确保不同系统间信息传递的准确性和完整性。通过Apifox等工具,设计和执行测试用例更加便捷高效。接口测试是保障系统稳定运行的第一道防线。
|
6天前
|
Web App开发 JSON 测试技术
API测试工具集合:让接口测试更简单高效
在当今软件开发领域,接口测试工具如Postman、Apifox、Swagger等成为确保API正确性、性能和可靠性的关键。Postman全球闻名但高级功能需付费,Apifox则集成了API文档、调试、Mock与自动化测试,简化工作流并提高团队协作效率,特别适合国内用户。Swagger自动生成文档,YApi开源但功能逐渐落后,Insomnia界面简洁却缺乏团队协作支持,Paw仅限Mac系统。综合来看,Apifox是国内用户的理想选择,提供中文界面和免费高效的功能。
|
1月前
|
监控 JavaScript 测试技术
postman接口测试工具详解
Postman是一个功能强大且易于使用的API测试工具。通过详细的介绍和实际示例,本文展示了Postman在API测试中的各种应用。无论是简单的请求发送,还是复杂的自动化测试和持续集成,Postman都提供了丰富的功能来满足用户的需求。希望本文能帮助您更好地理解和使用Postman,提高API测试的效率和质量。
106 11
|
2月前
|
JSON Java 测试技术
SpringCloud2023实战之接口服务测试工具SpringBootTest
SpringBootTest同时集成了JUnit Jupiter、AssertJ、Hamcrest测试辅助库,使得更容易编写但愿测试代码。
83 3
|
3月前
|
JSON 算法 数据可视化
测试专项笔记(一): 通过算法能力接口返回的检测结果完成相关指标的计算(目标检测)
这篇文章是关于如何通过算法接口返回的目标检测结果来计算性能指标的笔记。它涵盖了任务描述、指标分析(包括TP、FP、FN、TN、精准率和召回率),接口处理,数据集处理,以及如何使用实用工具进行文件操作和数据可视化。文章还提供了一些Python代码示例,用于处理图像文件、转换数据格式以及计算目标检测的性能指标。
95 0
测试专项笔记(一): 通过算法能力接口返回的检测结果完成相关指标的计算(目标检测)

热门文章

最新文章