写一个盲盒模拟器

最近想写一个小程序,随便写一个玩吧,先想了下功能:

1.有很多盲盒,可以选择模拟开启

2.自定义盲盒,我们可以自定义制作盲盒自己玩

3.用户界面,记录盲盒历史,可以给坏越提意见

所用技术栈: vue3 nodejs mysql uniapp express

后端数据处理:

先设计了两个数据表

1.存放盲盒分类,存放盲盒类别和盲盒的类别图片路径

(关于静态图片挂载的可以看我之前关于express的介绍)

2.存放盲盒细项,根据请求的盲盒类别来select对应盲盒细项

excel设计:

数据库部署:

接口编写调试:

先select全部,确认接口是通的

前端axios测试接口

前端模板我是在王进老师的咸虾米壁纸这个小程序上来的,重构组件和后端,可以省去琢磨css花费的时间(王进老师讲的小程序课堂确实挺好的,0基础的萌新要学习的可以看看~)

咸虾米壁纸&模版使用:

这块对js和html基础稍微好点的应该难度不大,其实布局也比较简单,css可以在后边再雕琢雕琢(其实是我的css有点稀烂哈哈)

前端定义跳转组件:

这边准备做一个组件用于盲盒的开启和基本信息的展示

当点击抽奖后根据中奖率来计算会得到什么奖品,渲染对应奖品信息,这边使用uni-pupop弹窗实现

这样就基本完成了一个盲盒模拟器了

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/22775.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

django 旅游服务系统-计算机毕业设计源码88939

摘 要 旅游服务系统采用采用django框架、python语言、以及Mysql数据库等技术。系统主要分为管理员和用户两部分,管理员管理主要功能包括:首页、轮播图(轮播图管理)、公告信息管理(公告信息)、资源管理&…

开源模型应用落地-LangSmith试炼-入门初体验-监控和自动化(五)

一、前言 在许多应用程序中,特别是在大型语言模型(LLM)应用程序中,收集用户反馈以了解应用程序在实际场景中的表现是非常重要的。 LangSmith可以轻松地将用户反馈附加到跟踪数据中。通常最好提供一个简单的机制(如赞成和反对按钮)来收集用户对应用程序响…

neo4j入门并使用案例说明

1、neo4j是什么 Neo4j是一个高性能的NoSQL图形数据库,它将结构化数据存储在网络(在数学角度称为图)上,而不是传统的表中。Neo4j是一个嵌入式的、基于磁盘的、具备完全的事务特性的Java持久化引擎。它因其高性能、轻量级、易嵌入和…

大模型时代的具身智能系列专题(九)

NYU Lerrel Pinto团队 Lerrel Pinto是NYU Courant的计算机科学助理教授,也是用机器人和人工智能实验室(CILVR小组)的一员。在加州大学伯克利分校读博士后,在CMU机器人研究所读博士,在印度理工学院古瓦哈蒂读本科。研究目标是让机器人在我们生…

Linux 35.5 + JetPack v5.1.3@FUEL编译安装

Linux 35.5 JetPack v5.1.3FUEL编译安装 1. 源由2. 编译&安装Step 1:依赖库安装Step 2:建立工程Step 3:编译工程Step 4:安装工程 3. 问题汇总3.1 fuel_planner/exploration_manager - dw3.2 fuel_planner/plan_env - OpenCV库…

找不到d3dx9_43.dll怎么修复?这个几种修复方法轻松解决

在计算机使用过程中,我们常常会遇到一些错误提示,其中之一就是“d3dx943.dll丢失”。这个问题通常会导致某些游戏或应用程序无法正常运行。为了解决这个问题,我总结出了以下五种解决方法,希望能对遇到类似问题的朋友们有所帮助。 …

QNX 7.0.0开发总结

1 QNX编译 1.1 基本概念 QNX可以直接使用Linux Makefile编译库和二进制,在Makefile文件中指定CCaarch64-unknown-nto-qnx7.0.0-g,或者CCx86_64-pc-nto-qnx7.0.0-g,保存退出后,运行source /qnx_sdk_path/qnxsdp-env.sh,…

前端canvas绘图,利用canvas在图片上面绘制标记以及给canvas添加点击事件。

前端canvas绘图&#xff0c;利用canvas在图片上面绘制标记以及给canvas添加点击事件。 需要实现的效果如下图: 首先需要一个承载的核心画布 <canvas id"canvas" width"800" height"600"></canvas>全部代码&#xff1a; <!DOCT…

LabVIEW减压阀和温控阀综合测试系统

在使用LabVIEW开发阀门测试软件时&#xff0c;特别是针对减压阀和温控阀&#xff0c;测试内容和注意事项包括以下方面&#xff1a; 测试内容 压力测试&#xff1a; 入口压力&#xff1a;测量阀门在不同入口压力下的表现。 出口压力&#xff1a;确保减压阀能够将出口压力控制在…

systemctlm-cosim-demo项目分析

概述 systemctlm-cosim-demo项目是Xilinx的systemc库的demo工程。 环境安装 qemu安装 cd xilinx_proj/Downloads git clone https://github.com/Xilinx/qemu.git cd qemu git checkout 74d70f8008# Configure and build # zynq7000 # ./configure --target-list"arm-s…

【乐吾乐3D可视化组态编辑器】用开关控制巡检车和路灯

一、运动设备开关控制 3D组态编辑器地址&#xff1a;3D可视化组态 - 乐吾乐Le5le 1.在场景中新建模拟运动设备及控制面板&#xff1a;启动/停止 2.单击巡检车设备新建模拟动画 3.设置模拟动画属性 4.单击启动面板&#xff0c;新建交互事件 5.设置交互触发类型&#xff0c;新建…

PS系统教程11

HUD拾色器 作用&#xff1a;它可以帮助使用者更加高效地选择和使用颜色&#xff0c;从而提高工作效率和设计质量。 先确定色相值改变饱和度改变亮度使用HUD拾色器选中画笔工具画笔模式-正常shiftAlt右键 色相轮 上下移动从黑到白亮度变化左右移动从浅到深饱和度的变化选中颜…

数据分析必备:一步步教你如何用Pandas做数据分析(17)

1、Pandas 连接 Pandas 连接的操作实例 Pandas具有与SQL等关系数据库非常相似的功能齐全的高性能内存中连接操作。 Pandas提供单个功能merge作为DataFrame对象之间所有标准数据库联接操作的入口点 pd.merge(left, right, howinner, onNone, left_onNone, right_onNone,left_i…

新手必看!现货伦敦金新手容易犯的两个错

对很多刚进入现货伦敦金市场的朋友来说&#xff0c;炒伦敦金是十分令人兴奋的&#xff0c;但兴奋归兴奋&#xff0c;我们还是要注意&#xff0c;由于现货伦敦金投资者过分的热情&#xff0c;很容易让自己跌入一些陷阱&#xff0c;犯下一些错误&#xff0c;下面我们就来介绍两个…

智能楼宇安防3D数据可视化平台满足日益增长的安防需求

在当今社会&#xff0c;安全是每个人和企业最为关心的问题。为满足日益增长的安防需求&#xff0c;3D可视化公司深圳华锐视点隆重推出安防平台3D可视化管理系统&#xff0c;以先进的三维技术为您的安全保驾护航。 安防平台3D可视化管理系统通过创新的三维可视化技术&#xff0c…

纷享销客BI智能分析平台技术架构介绍

纷享销客BI智能分析平台致力于降低用户上手门槛&#xff0c;无缝继承纷享销客PaaS平台的对象关系模型和权限体系&#xff0c;让使用纷享CRM的营销人员、销售人员、服务人员等各类角色人员都能够将分析场景与业务场景相融合&#xff0c;将数据思维融合到自己的日常工作、团队工作…

SpringCloud-面试篇(二十三)

&#xff08;1&#xff09;SpringCloud常见组件有那些 有无数微服务需要相互调用&#xff1a;可以用远程调用组件OpenFeign组件&#xff0c;也可以用Dobble 这么多微服务相互调用怎么管理&#xff1a;就用到注册中心组件Nacos&#xff0c;Eureka 所有的服务去找注册中心做注…

TCP协议与UDP协议区别

举个列子&#xff1a; 三次握手&#xff1a;为了解决网络信道不可靠的问题&#xff1b;防止客户端向服务端发送两次数据&#xff0c;客户端一直处于接收的状态。 四次挥手是一样的。当客户端提出关闭请求&#xff0c;服务端处于关闭等待状态&#xff0c;此时客户端可以发送数据…

PMP考试难吗?考试通过率有多少?

我们通常以考试的通过率来评判一个考试的难易程度。通常通过率达到60%以上&#xff0c;这个考试就不太难&#xff1b;达到80% &#xff0c;这个考试就是不难的。 PMP考试难吗&#xff1f; 不少想要考PMP的小伙伴都会有这样的疑惑&#xff0c;首先以PMP的含金量来说&#xff0…

产品推荐 | 基于Lattice USB3-GbE VIP IO技术赋能视频接口开发板

1、产品概述 支持视频接口平台 (VIP) – 为莱迪思VIP提供USB 3.0 和千兆以太网网络互连 灵活的快速原型设计和开发– 两个标准的高速连接器实现嵌入式视觉原型系统的简便快速硬件配置 可靠、经验证的即时使用设计– 莱迪思演示设计通过USB 3.0和工业千兆以太网接口实现快速视…