测试圈相亲平台开发流程(13):搜索功能

简介: 测试圈相亲平台开发流程(13):搜索功能

上节课我们最终选定了第二种方案进行父传子 数据。

   

先来个人信息表的数据传输:


   首先打开我们的Home.vue,给个人信息表的数据弄出来变成一个变量。

image.png

   

   然后找到子组件Detail的dom层使用行,并加上自定义属性。

image.png


好了,然后我们去Detail.vue组件内去接收这个自定义属性。

image.png


然后就是在我们的那些输入框中直接展示即可。

image.png


然后我们来测试一下:

image.png


可以看到功能已经成功了~


注意,我在开发的过程中,写错了几个单词。请大家不要抄错了。


man 被我写成了 men

address 被我写成了 adress

want 被我写成了 wangt


大家引以为戒,千万不要手滑写错单词,排查很难的。


好了,搞定了这个基础信息,下面就是择偶信息了。直接照葫芦画瓢!


正好大家再复习一遍!


第一步,在父组件中接口返回值中 弄好这个变量:


image.png


第二步,在子组件的dom层引用标签加入新的属性:

image.png


第三步,打开子组件,去接收:

image.png


第四步:在子组件中使用这个接收的变量

image.png



测试结果:ok

image.png


这里要说明一下,虽然择偶要求中都有最低 最高这种描述。


但是实际上,差一点也不是不行。


比如要求身高最低160,但是159也不会就完全被砍掉。只是会降低最终的匹配分数而已。


而161 这种则会加分,但考虑到正常人性选择,所以如果身高达到165以上,那么就要开始扣分,毕竟和人家心中目标差距太大了。


所以最终的算法肯定是要不断优化的,尽请关注。

相关文章
|
25天前
|
弹性计算 运维 Java
OS-Copilot参数功能全面测试报告
作为一名运维工程师,我主要负责云资源的运维和管理。通过使用OS Copilot的-t/-f/管道功能,我顺利解决了环境快速搭建的问题,例如Tomcat的快速部署。具体步骤包括购买ECS服务器、配置安全组、远程登录并安装OS Copilot。使用-f参数成功安装并启动Tomcat,自动配置JDK,并通过|管道功能验证了生成内容的正确性。整个过程非常流畅,极大提升了工作效率。
45 12
|
1月前
|
消息中间件 监控 小程序
电竞陪玩系统架构优化设计,陪玩app如何提升系统稳定性,陪玩小程序平台的测试与监控
电竞陪玩系统架构涵盖前端(React/Vue)、后端(Spring Boot/php)、数据库(MySQL/MongoDB)、实时通信(WebSocket)及其他组件(Redis、RabbitMQ、Nginx)。通过模块化设计、微服务架构和云计算技术优化,提升系统性能与可靠性。同时,加强全面测试、实时监控及故障管理,确保系统稳定运行。
|
2月前
|
监控 测试技术
slb测试会话保持功能
slb测试会话保持功能
78 6
|
3月前
|
人工智能 供应链 安全
AI辅助安全测试案例某电商-供应链平台平台安全漏洞
【11月更文挑战第13天】该案例介绍了一家电商供应链平台如何利用AI技术进行全面的安全测试,包括网络、应用和数据安全层面,发现了多个潜在漏洞,并采取了有效的修复措施,提升了平台的整体安全性。
136 4
|
3月前
|
监控 安全 测试技术
构建高效的精准测试平台:设计与实现指南
在软件开发过程中,精准测试是确保产品质量和性能的关键环节。一个精准的测试平台能够自动化测试流程,提高测试效率,缩短测试周期,并提供准确的测试结果。本文将分享如何设计和实现一个精准测试平台,从需求分析到技术选型,再到具体的实现步骤。
213 1
|
4月前
|
人工智能 监控 测试技术
云应用开发平台测试
云应用开发平台测试
101 2
|
3月前
|
监控 安全 测试技术
构建高效精准测试平台:设计与实现全攻略
在软件开发过程中,精准测试是确保产品质量的关键环节。一个高效、精准的测试平台能够自动化测试流程,提高测试覆盖率,缩短测试周期。本文将分享如何设计和实现一个精准测试平台,从需求分析到技术选型,再到具体的实现步骤。
107 0
|
1月前
|
数据可视化 前端开发 测试技术
接口测试新选择:Postman替代方案全解析
在软件开发中,接口测试工具至关重要。Postman长期占据主导地位,但随着国产工具的崛起,越来越多开发者转向更适合中国市场的替代方案——Apifox。它不仅支持中英文切换、完全免费不限人数,还具备强大的可视化操作、自动生成文档和API调试功能,极大简化了开发流程。
|
5天前
|
JSON 前端开发 测试技术
大前端之前端开发接口测试工具postman的使用方法-简单get接口请求测试的使用方法-简单教学一看就会-以实际例子来说明-优雅草卓伊凡
大前端之前端开发接口测试工具postman的使用方法-简单get接口请求测试的使用方法-简单教学一看就会-以实际例子来说明-优雅草卓伊凡
43 10
大前端之前端开发接口测试工具postman的使用方法-简单get接口请求测试的使用方法-简单教学一看就会-以实际例子来说明-优雅草卓伊凡
|
3天前
|
JSON 前端开发 API
以项目登录接口为例-大前端之开发postman请求接口带token的请求测试-前端开发必学之一-如果要学会联调接口而不是纯写静态前端页面-这个是必学-本文以优雅草蜻蜓Q系统API为实践来演示我们如何带token请求接口-优雅草卓伊凡
以项目登录接口为例-大前端之开发postman请求接口带token的请求测试-前端开发必学之一-如果要学会联调接口而不是纯写静态前端页面-这个是必学-本文以优雅草蜻蜓Q系统API为实践来演示我们如何带token请求接口-优雅草卓伊凡
24 5
以项目登录接口为例-大前端之开发postman请求接口带token的请求测试-前端开发必学之一-如果要学会联调接口而不是纯写静态前端页面-这个是必学-本文以优雅草蜻蜓Q系统API为实践来演示我们如何带token请求接口-优雅草卓伊凡

热门文章

最新文章