微信小程序开发图解案例教程(附精讲视频)(第3版)电子书

扉页

内容提要

第3版 前言

第1篇 微信小程序快速入门

第1章 认识微信小程序

1.1 微信小程序介绍

1.1.1 初识微信小程序

1.1.2 微信小程序的功能

1.1.3 微信小程序的使用场景

1.1.4 微信小程序能取代App吗

1.1.5 微信小程序的发展历程

1.1.6 微信小程序带来的机会

1.2 微信小程序开发准备

1.2.1 基础技术准备

1.2.2 开发准备

1.3 微信小程序开发工具的使用

1.3.1 创建项目

1.3.2 开发者工具界面

1.3.3 菜单栏

1.3.4 模拟器区域

1.3.5 编辑器区域

1.3.6 调试器区域

1.3.7 工具栏区域

1.3.8 常用快捷键

1.4 沙场大练兵：Hello World的创建

1.5 小结

第2章 微信小程序框架分析

2.1 微信小程序目录结构介绍

2.1.1 框架全局文件

2.1.2 工具类文件

2.1.3 框架页面文件

2.1.4 小试牛刀：制作“猫眼电影”底部标签导航

2.2 微信小程序注册程序的应用

2.3 微信小程序注册页面的使用

2.3.1 页面初始化数据

2.3.2 生命周期函数

2.3.3 页面相关事件处理函数

2.3.4 页面路由管理

2.3.5 自定义函数

2.3.6 setData设值函数

2.4 微信小程序如何绑定数据

2.4.1 组件属性绑定

2.4.2 控制属性绑定

2.4.3 关键字绑定

2.4.4 运算

2.4.5 小试牛刀：天气微信小程序

2.5 微信小程序条件渲染

2.5.1 wx:if判断单个组件

2.5.2 block wx:if判断多个组件

2.6 微信小程序列表渲染

2.6.1 wx:for列表渲染单个组件

2.6.2 block wx:for列表渲染多个组件

2.6.3 wx:key指定唯一标识符

2.7 微信小程序定义模板

2.7.1 定义模板

2.7.2 使用模板

2.8 微信小程序的引用功能

2.8.1 import引用

2.8.2 include引用

2.9 WXS小程序脚本语言

2.9.1 模块化

2.9.2 变量与数据类型

2.9.3 注释

2.9.4 语句

2.10 微信小程序WXSS样式渲染

2.10.1 尺寸单位

2.10.2 样式导入

2.10.3 内联样式

2.10.4 选择器

2.10.5 常用样式属性

2.11 沙场大练兵：仿“香哈菜谱”微信小程序

2.11.1 底部标签导航设计

2.11.2 宫格导航设计

2.11.3 香哈头条初始化数据

2.11.4 香哈头条列表渲染及绑定数据

2.11.5 香哈头条模板引用

2.12 小结

第3章 用微信小程序组件构建UI界面

3.1 视图容器组件

3.1.1 view视图容器

3.1.2 scroll-view可滚动视图区域

3.1.3 swiper滑块视图容器

3.1.4 movable-view可移动视图容器

3.1.5 cover-view、cover-image覆盖原生组件的视图容器

3.2 基础内容组件

3.2.1 icon图标

3.2.2 text文本

3.2.3 progress进度条

3.2.4 rich-text富文本

3.3 表单组件

3.3.1 button按钮

3.3.2 checkbox多项选择器

3.3.3 radio单项选择器

3.3.4 input单行输入框

3.3.5 textarea多行输入框

3.3.6 label改进表单可用性

3.3.7 picker滚动选择器

3.3.8 slider滑动选择器

3.3.9 switch开关选择器

3.3.10 form表单

3.3.11 editor富文本编辑器

3.4 导航组件

3.4.1 navigator页面链接组件

3.4.2 wx.navigateTo保留当前页跳转

3.4.3 wx.redirectTo关闭当前页跳转

3.4.4 wx.switchTab跳转到tabBar页面

3.4.5 wx.navigateBack返回上一页

3.4.6 设置导航条

3.5 媒体组件

3.5.1 audio音频

3.5.2 image图片

3.5.3 video视频

3.5.4 camera相机

3.5.5 live-player实时音视频播放

3.5.6 live-pusher实时音视频录制

3.6 地图组件

3.7 画布组件

3.8 沙场大练兵：表单登录注册微信小程序

3.8.1 登录设计

3.8.2 手机号注册设计

3.8.3 企业用户注册设计

3.9 小结

第4章 必备的微信小程序API

4.1 请求服务器数据API

4.2 文件上传与下载API

4.2.1 wx.uploadFile文件上传API

4.2.2 wx.downloadFile文件下载API

4.3 WebSocket会话API

4.4 图片处理API

4.4.1 wx.chooseImage选择图片API

4.4.2 wx.previewImage预览图片API

4.4.3 wx.getImageInfo获得图片信息API

4.4.4 wx.saveImageToPhotosAlbum保存图片到相册API

4.4.5 wx.compressImage压缩图片API

4.4.6 wx.chooseMessageFile从客户端会话选择文件API

4.5 文件操作API

4.5.1 wx.saveFile保存文件到本地API

4.5.2 wx.getSavedFileList获取本地文件列表API

4.5.3 wx.getSavedFileInfo获取本地文件信息API

4.5.4 wx.removeSavedFile删除本地文件API

4.5.5 wx.openDocument打开文档API

4.5.6 wx.getFileInfo获取文件信息API

4.5.7 FileSystemManager文件管理器

4.6 数据缓存API

4.6.1 数据缓存到本地

4.6.2 获取本地缓存数据

4.6.3 移除和清理本地缓存数据

4.7 位置信息API

4.7.1 获得位置、选择位置、打开位置

4.7.2 监听位置事件

4.7.3 地图组件控制API

4.7.4 收货地址API

4.8 设备应用API

4.8.1 获得系统信息

4.8.2 获取网络状态

4.8.3 加速度计

4.8.4 罗盘

4.8.5 拨打电话

4.8.6 扫码

4.8.7 剪贴板

4.8.8 蓝牙

4.8.9 屏幕亮度

4.8.10 用户截屏事件

4.8.11 振动

4.8.12 手机联系人

4.9 交互反馈API

4.9.1 消息提示框

4.9.2 模态弹窗

4.9.3 操作菜单

4.10 用户及授权设置API

4.10.1 登录API

4.10.2 用户信息API

4.10.3 授权API

4.10.4 设置API

4.11 微信支付API

4.11.1 微信小程序支付介绍

4.11.2 微信小程序支付实战

4.12 分享转发API

4.13 沙场大练兵：仿“豆瓣电影”微信小程序

4.13.1 电影顶部页签切换效果

4.13.2 电影海报轮播效果

4.13.3 电影列表方式布局

4.13.4 电影详情介绍页布局

4.13.5 项目上传与预览

4.14 小结

第5章 微信小程序云开发

5.1 认识小程序云开发

5.1.1 云开发和传统开发的对比

5.1.2 创建小程序云开发项目

5.2 云开发控制台的使用

5.2.1 运营分析

5.2.2 数据库

5.2.3 存储

5.2.4 云函数

5.2.5 设置

5.2.6 费用管理和工单

5.3 云函数

5.3.1 云函数介绍

5.3.2 云函数的使用

5.3.3 Promise风格

5.3.4 npm的安装与使用

5.3.5 云函数本地调试

5.3.6 云函数定时器

5.4 云开发文件存储

5.4.1 uploadFile文件上传API

5.4.2 downloadFile文件下载API

5.4.3 deleteFile文件删除API

5.4.4 getTempFileURL获取文件临时路径API

5.5 云开发数据库

5.5.1 数据库介绍

5.5.2 数据库初始化

5.5.3 数据新增操作

5.5.4 数据查询操作

5.5.5 数据修改操作

5.5.6 数据删除操作

5.5.7 数据库操作符

5.6 沙场大练兵：地址管理云开发

5.6.1 数据库设计

5.6.2 地址列表及删除地址云开发

5.6.3 新增地址及编辑地址云开发

5.7 小结

第2篇 综合案例应用

第6章 综合案例：仿“中国婚博会”微信小程序

6.1 需求描述

6.2 设计思路

6.3 相关知识点

6.4 准备工作

6.5 设计流程

6.5.1 底部标签导航设计

6.5.2 海报轮播效果设计

6.5.3 宫格导航设计

6.5.4 “全部分类”导航设计

6.5.5 “现金券”下拉菜单筛选条件设计

6.5.6 “现金券”列表页设计

6.5.7 婚博会索票界面设计

6.5.8 获知渠道弹出层设计

6.6 小结

第7章 综合案例：仿“华为商城”微信小程序

7.1 需求描述

7.2 设计思路

7.3 相关知识点

7.4 准备工作

7.5 设计流程

7.5.1 “我的”界面列表导航设计

7.5.2 账号登录

7.5.3 用户注册

7.5.4 首页布局设计及动态获取数据

7.5.5 分类导航设计及动态获取数据

7.6 小结

第8章 综合案例：记账本微信小程序云开发

8.1 需求描述

8.2 设计思路

8.3 相关知识点

8.4 准备工作

8.5 设计流程

8.5.1 账户列表

8.5.2 创建账户

8.5.3 账户明细列表

8.5.4 记一笔账户明细

8.5.5 分页获取账本列表

8.5.6 创建记账本

8.6 小结