第 1章 微信小程序入門 1 1.1　初識微信小程序 1 1.1.1　什么是微信小程序 2 1.1.2　微信小程序的特點 2 1.1.3　微信小程序的發(fā)展前景 3 1.1.4　微信小程序的宿主環(huán)境 4 1.2　微信小程序開發(fā)前準備 5 1.2.1　注冊微信小程序開發(fā)賬號 5 1.2.2　獲取微信小程序AppID 8 1.2.3　安裝微信開發(fā)者工具 9 1.2.4　創(chuàng)建微信小程序項目 10 1.3　微信小程序開發(fā)基礎 12 1.3.1　微信小程序的項目結(jié)構(gòu) 12 1.3.2　微信小程序的頁面組成 12 1.3.3　微信小程序的通信模型 13 1.4　微信開發(fā)者工具的使用 13 1.4.1　認識微信開發(fā)者工具 13 1.4.2　微信小程序的項目設置 17 1.4.3　微信小程序開發(fā)常用快捷鍵 18 1.5　微信小程序的項目成員 20 1.5.1　項目成員的組織結(jié)構(gòu) 20 1.5.2　項目成員的分工 21 1.5.3　項目成員和體驗成員的管理 21 1.5.4　項目成員的權(quán)限 22 1.5.5　添加項目成員和體驗成員 23 1.6　微信小程序的發(fā)布上線 24 1.6.1　微信小程序的版本 24 1.6.2　微信小程序的上線流程 25 本章小結(jié) 27 課后練習 27 第 2章 微信小程序頁面制作 29 【案例2-1】個人信息 29 案例分析 30 知識儲備 30
1. WXML簡介 30
2. WXSS簡介 31
3. 常用組件 31
4. 頁面路徑配置 31
5. view組件 32
6. image組件 33
7. rpx單位 35
8. 樣式導入 35 案例實現(xiàn) 36 【案例2-2】本地生活 37 案例分析 37 知識儲備 38
1. swiper和swiper-item組件 38
2. text組件 39
3. Flex布局 40 案例實現(xiàn) 42 【案例2-3】婚禮邀請函 45 案例分析 45 知識儲備 47
1. 導航欄配置 47
2. 標簽欄配置 47
3. vw、vh單位 49
4. video組件 49
5. 表單組件 50 案例實現(xiàn) 54 本章小結(jié) 64 課后練習 64 第3章 微信小程序頁面交互 65 【案例3-1】比較數(shù)字大小 66 案例分析 66 知識儲備 66
1. Page( )函數(shù) 66
2. 數(shù)據(jù)綁定 68
3. 事件綁定 69
4. 事件對象 70
5. this關鍵字 71
6. setData( )方法 71
7. 條件渲染 72
8. 標簽 72
9. hidden屬性 73 案例實現(xiàn) 73 【案例3-2】計算器 75 案例分析 75 知識儲備 76
1. data-*自定義屬性 76
2. 模塊 77 案例實現(xiàn) 77 【案例3-3】美食列表 85 案例分析 85 知識儲備 86
1. 列表渲染 86
2. 網(wǎng)絡請求 87
3. 提示框 88
4. WXS 89
5. 上拉觸底 91
6. 下拉刷新 91 案例實現(xiàn) 92 【案例3-4】調(diào)查問卷 97 案例分析 98 知識儲備 98
雙向數(shù)據(jù)綁定 98 案例實現(xiàn) 98 本章小結(jié) 102 課后練習 102 第4章 微信小程序常用API（上） 104 【案例4-1】音樂播放器 104 案例分析 104 知識儲備 106
1. scroll-view組件 106
2. slider組件 107
3. 標簽 108
4. 背景音頻API 109 案例實現(xiàn) 110 【案例4-2】錄音機 121 案例分析 121 知識儲備 122
1. 錄音API 122
2. 音頻API 123 案例實現(xiàn) 124 【案例4-3】頭像上傳下載 127 案例分析 128 知識儲備 128
1. 選擇媒體API 128
2. 圖片預覽API 129
3. 文件上傳API 130
4. 文件下載API 131 案例實現(xiàn) 131 【案例4-4】模擬時鐘 134 案例分析 134 知識儲備 134
1. canvas組件 134
2. 畫布API 135 案例實現(xiàn) 137 本章小結(jié) 142 課后練習 143 第5章 微信小程序常用API（下） 144 【案例5-1】羅盤動畫 144 案例分析 144 知識儲備 145
動畫API 145 案例實現(xiàn) 147 【案例5-2】用戶登錄 151 案例分析 151 知識儲備 151
1. 登錄流程時序 151
2. 登錄API 153
3. 數(shù)據(jù)緩存API 154
4. 頭像昵稱填寫 155
5. App( )函數(shù) 157 案例實現(xiàn) 158 【案例5-3】查看附近美食餐廳 162 案例分析 163 知識儲備 163
1. 騰訊地圖SDK 163
2. map組件 168
3. 地圖API 169
4. 位置API 170
5. 路由API 170 案例實現(xiàn) 172 【案例5-4】在線聊天 176 案例分析 176 知識儲備 177
1. WebSocket API 177
2. SocketTask 178 案例實現(xiàn) 179 本章小結(jié) 184 課后練習 184 第6章 綜合項目——“點餐”微信小程序 186 【任務6-1】項目開發(fā)準備 186 開發(fā)背景 186 項目模塊劃分 187 項目初始化 187 【任務6-2】封裝網(wǎng)絡請求 189 任務分析 189 任務實現(xiàn) 189 【任務6-3】用戶登錄 192 任務分析 192 任務實現(xiàn) 193 【任務6-4】商家首頁 196 任務分析 196 任務實現(xiàn) 196 【任務6-5】菜單列表頁 201 任務分析 201 任務實現(xiàn) 202 【任務6-6】購物車 209 任務分析 209 任務實現(xiàn) 210 【任務6-7】訂單確認頁 220 任務分析 220 任務實現(xiàn) 220 【任務6-8】訂單詳情頁 227 任務分析 227 任務實現(xiàn) 228 【任務6-9】訂單列表頁 231 任務分析 231 任務實現(xiàn) 232 【任務6-10】消費記錄頁 238 任務分析 238 任務實現(xiàn) 238 本章小結(jié) 241 課后練習 241 第7章 微信小程序開發(fā)進階 243 【案例7-1】自定義標簽欄 243 案例分析 244 知識儲備 245
1. 創(chuàng)建自定義組件 245
2. 使用自定義組件 246
3. 使用自定義組件渲染標簽欄 247
4. Vant Weapp組件庫 248 案例實現(xiàn) 249 【案例7-2】電影列表 253 案例分析 253 知識儲備 254
1. WeUI組件庫 254
2. navigator組件 256 案例實現(xiàn) 257 【案例7-3】待辦事項 262 案例分析 262 知識儲備 263
1. uni-app框架概述 263
2. HBuilder X開發(fā)工具 264
3. 創(chuàng)建uni-app項目 265
4. uni-app項目的目錄結(jié)構(gòu) 266
5. 將uni-app項目運行至微信小程序 266
6. uni-app項目的全局配置文件 267 案例實現(xiàn) 268 本章小結(jié) 272 課后練習 272 第8章 uni-app項目——“短視頻”微信小程序 274 【任務8-1】項目開發(fā)準備 274 項目展示 274 項目初始化 276 【任務8-2】公共頭部區(qū)域 277 任務分析 277 任務實現(xiàn) 277 【任務8-3】導航欄區(qū)域 279 任務分析 279 任務實現(xiàn) 279 【任務8-4】輪播圖區(qū)域 281 任務分析 281 任務實現(xiàn) 281 【任務8-5】視頻列表區(qū)域 283 任務分析 283 任務實現(xiàn) 283 【任務8-6】視頻詳情頁 285 任務分析 285 任務實現(xiàn) 286 本章小結(jié) 292 課后練習 292