目录
第 1 章 挑战 2048 小游戏 1
——Vue 3 + TypeScript + uni-app
1.1 开发背景 1
1.2 系统设计 2
1.2.1 开发环境 2
1.2.2 业务流程 2
1.2.3 功能结构 2
1.3 技术准备 3
1.3.1 技术概览 3
1.3.2 Vue 3 3
1.3.3 TypeScript 4
1.3.4 uni-app 5
1.3.5 Vue 3、TypeScript 和 uni-app 的关系 6
1.4 玩家界面设计 6
1.4.1 顶部状态栏设计 6
1.4.2 中部游戏板设计 7
1.4.3 底部控制区设计 8
1.5 玩家界面样式设计 9
1.5.1 顶部区域样式 9
1.5.2 中部区域样式 10
1.5.3 底部区域样式 12
1.6 游戏逻辑模块设计 14
1.6.1 初始化矩阵 14
1.6.2 旋转矩阵 15
1.6.3 向上合并数字 16
1.6.4 添加随机数字 17
1.6.5 方向移动 18
1.7 事件处理模块设计 20
1.7.1 游戏开始 20
1.7.2 游戏结束 20
1.7.3 方向控制 20
1.8 时间管理模块设计 21
1.8.1 Vue 3 的 ref 21
1.8.2 计时器模块设计 22
1.9 项目运行 22
1.10 源码下载 25
第 2 章 优选投票小程序 26
——Vue.js + uni-app + uni-ui + uniCloud
2.1 开发背景 26
2.2 系统设计 27
2.2.1 开发环境 27
2.2.2 业务流程 27
2.2.3 功能结构 27
2.3 技术准备 28
2.3.1 技术概览 28
2.3.2 uniCloud 云开发 28
2.3.3 uni-ui 组件库 29
2.4 数据库设计 30
2.4.1 数据库概要说明 30
2.4.2 集合结构 30
2.5 用户管理模块设计 31
2.5.1 用户登录/注册 32
2.5.2 个人信息管理 33
2.5.3 权限控制 34
2.6 投票创建模块设计 35
2.6.1 基础信息设置 35
2.6.2 选项配置 36
2.6.3 规则设定 38
2.6.4 数据校验和数据提交 39
2.7 投票展示模块设计 41
2.7.1 列表页设计 41
2.7.2 详情页设计 43
2.7.3 状态标识设计 44
2.8 投票交互模块设计 46
2.8.1 投票提交 46
2.8.2 防重复机制 49
2.8.3 结果反馈 50
2.9 数据统计模块设计 51
2.9.1 排行榜 51
2.9.2 个人记录 52
2.9.3 实时统计 52
2.10 项目部署与运行 53
2.11 源码下载 57
第 3 章 旅行者日记小程序 58
——Vue 3 + TypeScript + SCSS + uni-app + uniCloud
3.1 开发背景 58
3.2 系统设计 59
3.2.1 开发环境 59
3.2.2 业务流程 59
3.2.3 功能结构 60
3.3 技术准备 60
3.3.1 技术概览 60
3.3.2 SCSS 61
3.4 数据库设计 62
3.4.1 数据库概要说明 62
3.4.2 集合结构 62
3.5 用户认证模块设计 64
3.5.1 用户登录/注册 64
3.5.2 权限控制 65
3.5.3 会话管理 65
3.6 首页模块设计 66
3.6.1 最新文章列表和热门文章列表 66
3.6.2 文章详情 68
3.6.3 点赞/取消点赞 68
3.7 分类模块设计 69
3.7.1 分类管理 69
3.7.2 分类文章列表 71
3.7.3 轮播图展示 73
3.8 发布模块设计 74
3.8.1 富文本编辑 74
3.8.2 分类选择 74
3.8.3 发布设置 75
3.9 个人中心模块设计 75
3.9.1 个人信息展示 76
3.9.2 我的点赞 77
3.9.3 我的分类 77
3.9.4 统计数据 78
3.10 项目部署与运行 79
3.11 源码下载 81
第 4 章 好记忆翻牌小游戏 82
——uni.showToast + Fisher-Yates 算法 + picker 组件 + localStorage
4.1 开发背景 83
4.2 系统设计 83
4.2.1 开发环境 83
4.2.2 业务流程 83
4.2.3 功能结构 84
4.3 技术准备 85
4.3.1 uni.showToast 85
4.3.2 Fisher-Yates 算法 85
4.3.3 picker 组件 86
4.3.4 localStorage 87
4.4 初始界面设计 87
4.5 游戏功能设计 92
4.5.1 记忆阶段功能设计 92
4.5.2 游戏阶段功能设计 93
4.5.3 翻开卡牌功能设计 93
4.5.4 倒计时功能设计 95
4.6 弹出层设计 96
4.7 扩展功能设计 99
4.7.1 选择游戏难度功能设计 99
4.7.2 记录最佳成绩功能设计 102
4.8 项目运行 104
4.9 源码下载 105
第 5 章 圈文化社区小程序 106
——Vue.js + uView UI + vk-unicloud + Pinia + MongoDB
5.1 开发背景 107
5.2 系统设计 107
5.2.1 开发环境 107
5.2.2 业务流程 107
5.2.3 功能结构 108
5.3 技术准备 109
5.3.1 uView UI 109
5.3.2 vk-unicloud 112
5.3.3 Pinia 115
5.3.4 插件安装 116
5.4 数据库设计 117
5.4.1 数据库概要说明 117
5.4.2 集合结构 117
5.5 首页设计 120
5.5.1 首页头部组件设计 120
5.5.2 正在加载组件设计 121
5.5.3 推荐文章列表项组件设计 121
5.5.4 空列表项组件设计 123
5.5.5 首页组件设计 124
5.6 圈子功能设计 127
5.6.1 圈子页面设计 127
5.6.2 全部圈子展示页面设计 130
5.6.3 圈子详情页面设计 132
5.7 发布功能设计 134
5.7.1 发布文章功能设计 134
5.7.2 创建圈子功能设计 137
5.8 文章详情页面和评论功能设计 139
5.8.1 文章详情页面设计 140
5.8.2 评论功能设计 142
5.8.3 点赞功能设计 144
5.9 登录和注册功能设计 145
5.9.1 用户登录功能设计 145
5.9.2 用户注册功能设计 147
5.10 “我的”页面功能设计 148
5.10.1 “我的”页面设计 149
5.10.2 编辑资料页面设计 151
5.10.3 “我的文章”页面设计 153
5.11 项目部署与运行 155
5.12 源码下载 159
第 6 章 众读图书借阅小程序 160
——Vue.js + uView UI + vk-unicloud + Wot UI + uni-ui + MongoDB
6.1 开发背景 161
6.2 系统设计 161
6.2.1 开发环境 161
6.2.2 业务流程 161
6.2.3 功能结构 162
6.3 技术准备 163
6.3.1 Wot UI 164
6.3.2 uni-ui 165
6.3.3 插件和组件安装 167
6.4 数据库设计 168
6.4.1 数据库概要说明 168
6.4.2 集合结构 168
6.5 前台首页设计 170
6.6 图书分类页面设计 172
6.7 图书借阅功能设计 176
6.7.1 申请借阅页面设计 176
6.7.2 借阅订单页面设计 178
6.7.3 订单详情页面设计 182
6.8 登录和注册功能简介 184
6.8.1 用户登录 184
6.8.2 用户注册 184
6.9 个人主页功能设计 185
6.9.1 “我的”页面设计 185
6.9.2 查看取书记录功能设计 189
6.9.3 查看还书记录功能设计 190
6.10 后台图书管理模块设计 191
6.10.1 图书列表管理 191
6.10.2 轮播图列表管理 195
6.10.3 图书分类管理 199
6.10.4 借阅订单管理 202
6.11 项目部署与运行 206
6.12 源码下载 208
第 7 章 明日科技小程序 209
——Vue.js + uni-app + uniCloud
7.1 开发背景 210
7.2 系统设计 210
7.2.1 开发环境 210
7.2.2 业务流程 210
7.2.3 功能结构 210
7.3 技术准备 212
7.4 数据库设计 212
7.4.1 数据库概要说明 212
7.4.2 集合结构 213
7.5 Tab 设置模块设计 213
7.5.1 Tab 栏文字设置 214
7.5.2 Tab 颜色设置 214
7.5.3 数据验证 215
7.5.4 数据持久化 215
7.6 轮播图管理模块设计 216
7.6.1 列表页实现 216
7.6.2 添加页实现 217
7.6.3 编辑页实现 219
7.7 产品介绍管理模块设计 220
7.7.1 数据结构设计 221
7.7.2 核心功能实现 221
7.8 公司简介管理模块设计 223
7.8.1 数据结构设计 223
7.8.2 核心功能实现 224
7.9 “联系我们”管理模块设计 226
7.9.1 模板设计 227
7.9.2 脚本设计 228
7.10 明日科技小程序前台设计 230
7.10.1 顶部导航栏设计 232
7.10.2 轮播图模块设计 234
7.10.3 产品介绍模块设计 236
7.10.4 公司简介模块设计 239
7.10.5 “联系我们”模块设计 241
7.11 项目部署与运行 244
7.12 源码下载 247
第 8 章 乐帮招商加盟小程序 248
——Vue.js + uView UI + vk-unicloud + Wot UI + uni-ui + MongoDB
8.1 开发背景 248
8.2 系统设计 249
8.2.1 开发环境 249
8.2.2 业务流程 249
8.2.3 功能结构 250
8.3 技术准备 251
8.4 数据库设计 253
8.4.1 数据库概要说明 253
8.4.2 集合结构 253
8.5 前台首页设计 255
8.6 行业分类页面设计 258
8.7 申请加盟功能设计 260
8.7.1 加盟咨询页面设计 260
8.7.2 查看申请加盟列表页面设计 265
8.8 登录和注册功能简介 267
8.8.1 用户登录 267
8.8.2 用户注册 268
8.9 个人主页功能设计 269
8.9.1 “我的”页面设计 269
8.9.2 查看收藏招商信息页面设计 272
8.10 后台登录功能设计 274
8.11 后台招商加盟模块设计 277
8.11.1 轮播图管理 277
8.11.2 行业分类管理 280
8.11.3 招商信息管理 283
8.12 项目部署与运行 288
8.13 源码下载 290
