第1篇　微信小程序快速入门
第1章　认识微信小程序　1
学习导读　1
学习目标　1
1.1　微信小程序介绍　2
1.1.1　初识微信小程序　2
1.1.2　微信小程序的功能和特点　2
1.1.3　微信小程序的使用场景　5
1.2　微信小程序开发准备　6
1.2.1　基础技术准备　6
1.2.2　开发准备　6
1.3　微信小程序开发者工具的使用　8
1.3.1　创建项目　8
1.3.2　开发者工具界面　9
1.4　沙场大练兵：创建Hello World　15
1.5　小结　16
1.6　习题　17
第2章　微信小程序框架分析　18
学习导读　18
学习目标　18
2.1　微信小程序模板介绍　18
2.2　微信小程序目录结构介绍　19
2.2.1　框架全局文件　20
2.2.2　工具类文件　29
2.2.3　框架页面文件　29
2.3　微信小程序注册程序的应用　32
2.4　微信小程序注册页面的使用　33
2.4.1　页面初始化数据　34
2.4.2　生命周期函数　35
2.4.3　页面相关事件处理函数　35
2.4.4　页面路由管理　37
2.4.5　自定义函数　38
2.4.6　setData设值函数　38
2.5　微信小程序模块化　39
2.6　微信小程序组件化　40
2.7　微信小程序运行环境　41
2.8　沙场大练兵：制作“猫眼电影”tabBar标签导航　42
2.9　小结　44
2.10　习题　44
第3章　微信小程序核心技术　45
学习导读　45
学习目标　45
3.1　WXML　45
3.1.1　WXML介绍　45
3.1.2　WXML的语法和功能　46
3.1.3　绑定数据　47
3.1.4　条件渲染　48
3.1.5　列表渲染　48
3.1.6　模板功能　50
3.1.7　引用功能　50
3.1.8　事件绑定　51
3.1.9　数据传递　51
3.1.10　实现天气微信小程序　51
3.2　WXSS样式语言　54
3.2.1　WXSS介绍　54
3.2.2　WXSS语法　54
3.2.3　尺寸单位　56
3.2.4　样式导入　56
3.2.5　内联样式　56
3.2.6　选择器　56
3.3　JS语言　57
3.3.1　数据类型和变量　57
3.3.2　运算符和控制流　57
3.3.3　函数和事件处理　58
3.3.4　异步编程　58
3.3.5　对象和数组操作　59
3.3.6　模块化开发　59
3.3.7　使用限制　59
3.4　WXS语言　60
3.4.1　模块化　61
3.4.2　变量与数据类型　61
3.5　沙场大练兵：开发仿“香哈菜谱”微信小程序　63
3.5.1　底部标签导航设计　63
3.5.2　宫格导航设计　65
3.5.3　香哈头条初始化数据　67
3.5.4　香哈头条列表渲染及绑定数据　68
3.5.5　香哈头条列表模板引用　69
3.6　小结　70
3.7　习题　70
第4章　用微信小程序组件构建UI　71
学习导读　71
学习目标　71
4.1　视图容器组件　71
4.1.1　view组件　71
4.1.2　scroll-view组件　72
4.1.3　swiper组件　75
4.1.4　movable-view组件　78
4.2　基础内容组件　80
4.2.1　icon组件　80
4.2.2　text组件　81
4.2.3　progress组件　81
4.3　表单组件　82
4.3.1　button组件　82
4.3.2　checkbox组件　85
4.3.3　radio组件　85
4.3.4　input组件　86
4.3.5　textarea组件　89
4.3.6　label组件　90
4.3.7　picker组件　92
4.3.8　slider组件　97
4.3.9　switch组件　98
4.3.10　form组件　99
4.4　导航组件　100
4.4.1　navigator组件　101
4.4.2　wx.navigateTo组件　103
4.4.3　wx.redirectTo组件　103
4.4.4　wx.switchTab组件　104
4.4.5　wx.navigateBack组件　104
4.4.6　设置导航栏　105
4.5　媒体组件　106
4.5.1　image组件　106
4.5.2　video组件　108
4.5.3　camera组件　111
4.6　沙场大练兵：开发表单登录注册微信小程序　113
4.6.1　登录页面设计　113
4.6.2　手机快速注册页面设计　116
4.6.3　企业用户注册页面设计　118
4.7　小结　122
4.8　习题　123
第5章　必备的微信小程序API　124
学习导读　124
学习目标　124
5.1　请求服务器数据API　124
5.2　文件上传与下载API　127
5.2.1　wx.uploadFile API　127
5.2.2　wx.downloadFile API　129
5.3　WebSocket会话API　130
5.4　图片处理API　133
5.4.1　wx.chooseMedia API　133
5.4.2　wx.previewImage API　134
5.4.3　wx.getImageInfo API　135
5.4.4　wx.saveImageToPhotosAlbum API　136
5.4.5　wx.compressImage API　136
5.4.6　wx.chooseMessageFile API　137
5.5　文件操作API　137
5.5.1　wx.getFileSystemManager API　137
5.5.2　FileSystemManager.saveFile API　137
5.5.3　FileSystemManager.getSavedFileList API　138
5.5.4　FileSystemManager.removeSavedFile API　139
5.5.5　FileSystemManager.getFileInfo API　139
5.5.6　wx.openDocument API　140
5.6　数据缓存API　140
5.6.1　将数据缓存到本地API　141
5.6.2　获取本地缓存数据API　142
5.6.3　移除和清理本地缓存数据API　144
5.7　位置信息API　145
5.7.1　获取当前位置、选择位置和查看位置API　146
5.7.2　监听位置事件API　148
5.7.3　收货地址API　148
5.8　设备应用API　149
5.8.1　获取网络状态API　149
5.8.2　拨打电话和发送短信API　150
5.8.3　扫码API　150
5.8.4　剪贴板API　150
5.8.5　屏幕亮度API　150
5.8.6　用户截屏事件API　151
5.8.7　振动API　151
5.9　交互反馈API　151
5.9.1　消息提示框API　151
5.9.2　模态弹窗API　152
5.9.3　操作菜单API　154
5.9.4　返回询问对话框API　154
5.10　用户及授权设置API　154
5.10.1　登录API　154
5.10.2　用户信息API　156
5.10.3　授权API　157
5.10.4　设置API　158
5.11　微信支付API　160
5.11.1　微信小程序支付介绍　160
5.11.2　微信小程序支付实战　161
5.12　沙场大练兵：开发仿“豆瓣电影”微信小程序　162
5.12.1　顶部页签切换设计　162
5.12.2　海报轮播设计　164
5.12.3　电影列表布局　165
5.12.4　电影详情页面布局　167
5.12.5　项目上传与预览　171
5.13　小结　171
5.14　习题　171
第6章　微信小程序云开发　172
学习导读　172
学习目标　172
6.1　认识微信小程序云开发　172
6.1.1　传统开发和云开发　172
6.1.2　创建微信小程序云开发项目　173
6.2　云开发控制台的使用　174
6.2.1　运营分析　174
6.2.2　数据库　174
6.2.3　存储　175
6.2.4　云函数　175
6.2.5　设置　176
6.3　云函数应用　176
6.3.1　云函数介绍　176
6.3.2　云函数的使用　177
6.3.3　Promise对象　179
6.3.4　npm的安装与使用　180
6.3.5　云函数本地调试　181
6.3.6　云函数定时触发器　182
6.4　云开发文件存储API　183
6.4.1　wx.cloud uploadFile API　183
6.4.2　wx.cloud downloadFile API　184
6.4.3　wx.cloud deleteFile API　184
6.4.4　wx.cloud getTempFileURL API　184
6.5　云开发数据库　185
6.5.1　数据库介绍　185
6.5.2　数据库初始化　185
6.5.3　数据新增操作　186
6.5.4　数据查询操作　186
6.5.5　数据修改操作　187
6.5.6　数据删除操作　188
6.6　沙场大练兵：地址管理云开发　189
6.6.1　数据库设计　189
6.6.2　地址列表及删除地址云开发　189
6.6.3　新增地址及编辑地址云开发　193
6.7　小结　200
6.8　习题　200
第2篇　综合案例应用
第7章　综合案例：开发仿“中国婚博会”微信小程序　201
学习导读　201
学习目标　201
7.1　需求描述　202
7.2　设计思路　202
7.3　相关知识点　202
7.4　准备工作　202
7.5　设计流程　203
7.5.1　底部标签导航设计　203
7.5.2　海报轮播效果设计　204
7.5.3　宫格导航设计　205
7.5.4 “全部分类”页面设计　207
7.5.5 “现金券”页面的下拉菜单设计　211
7.5.6　现金券列表设计　213
7.6　小结　215
7.7　习题　215
第8章　综合案例：开发仿“华为商城”微信小程序　216
学习导读　216
学习目标　216
8.1　需求描述　216
8.2　设计思路　217
8.3　相关知识点　218
8.4　准备工作　218
8.5　设计流程　218
8.5.1 “我的”页面列表导航设计　218
8.5.2　账号登录　223
8.5.3　用户注册　229
8.5.4　首页布局设计及动态获取数据　232
8.5.5　分类导航设计及动态获取数据　237
8.6　小结　241
8.7　习题　241
第9章　综合案例：云开发记账本微信小程序　242
学习导读　242
学习目标　242
9.1　需求描述　242
9.2　设计思路　243
9.3　相关知识点　243
9.4　准备工作　244
9.5　设计流程　245
9.5.1　账户列表　245
9.5.2　创建账户　250
9.5.3　账户明细列表　253
9.5.4　记一笔账户明细　256
9.5.5　分页显示账本列表　261
9.5.6　创建账本　263
9.6　小结　267
9.7　习题　267
第3篇　AI辅助编程
第10章　微信小程序AI辅助编程　268
学习导读　268
学习目标　268
10.1　CodeBuddy概述　269
10.1.1　CodeBuddy的功能与特点　269
10.1.2　CodeBuddy的安装与使用　269
10.2　用AI读懂代码　271
10.2.1　生成代码注释　271
10.2.2　解释代码段　273
10.2.3　总结代码功能　273
10.3　用AI提效编程　274
10.3.1　生成基础代码骨架　274
10.3.2　优化与重构代码　282
10.3.3　调试与解决问题　282
10.4　沙场大练兵：制作简历微信小程序　283
10.5　小结　286
10.6　习题　286