当前位置: 首页 > news >正文

写一个盲盒模拟器

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

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.lryc.cn/news/364026.html

相关文章:

  • Java使用正则表达式匹配以某个字符开始,某个字符结束
  • 什么叫硬编码?如何避免硬编码
  • RK3588 Android13自定义一个按键实现长按短按
  • 映射网络驱动器自动断开的解决方法
  • (Arkts界面示例)ets pages Demo(笔记版本0.0.1)
  • Python 动态导入库
  • 【WP|8】深入解析WordPress钩子函数
  • Java集合简略记录
  • 能获取淘宝商品简化链接的浏览器书签
  • JMeter Plugins Manager---插件安装
  • docker-compose入门级实战教程
  • MATLAB sort
  • AB测试实战
  • Java高级面试精粹:问题与解答集锦(六)
  • MySQL之数据库数据库范式学习笔记(二)
  • 【Qt】 new成功,但是没有进入到构造函数。
  • 高清多媒体接口(High Definition Multimedia Interface, HDMI)
  • Spring AI 第二讲 之 Chat Model API 第五节HuggingFace Chat
  • 【笔记】Sturctured Streaming笔记总结(Python版)
  • Python函数进阶
  • [知识点]c++ delete与delete[ ]
  • iCloud如何被高效利用?
  • 月入30000的软件测试人员,简历是什么样子的?
  • nginx官网源代码方式安装nginx并编译
  • iOS ActivityViewController使用
  • 新手快速上手IDEA【常用快捷键】
  • MySQL里如果有字段是function怎么查询呢?
  • 从高海拔到严寒季的测量作业更要「快准稳」,怎么实现?
  • WowTab:简洁界面,效率神器,重塑新标签页浏览体验
  • PostgreSQL 17 Beta1 发布,酷克数据再次贡献核心力量