實戰微信小程序：JavaScript、WXML與Flexbox綜合開發

于连林，CSDN博客专家，从事Android开发和教育多年，做过很多个项目,包括办公类,O2O等类型,曾在培训机构从事Android教育，有上千课时讲课经验,收到过许多好评。__eol__

第一部分認識微信小程序
1 微信小程序紹. . . . . . . .. . . . . .. . . . . . . 1

1.1 微信小程序是什麽1
1.2 微信小程序的前景2
1.3 微信小程序與訂閱號、服務號的區別3
1.4 如何創建一個微信小程序4
1.4.1 成為微信小程序開發者5
1.4.2 安裝開發者編輯器7
1.5 運行一個微信小程序7
1.6 本章小結9

2 體驗微信小序. . . . . . . . . . . . . . . . . . 10

2.1 界面與操作10
2.2 編輯功能11
2.3 調試功能12
2.4 項目功能16
2.5 常用快捷鍵18
2.6 項目的目錄與文件結構18
2.7 本章小結21
第二部分讀懂每一行代碼
3 JavaScript 語法. . . . . . . . . . . . .. . . .. . . . . . . . 22

3.1 JavaScript 簡介22
3.2 基礎語法24
3.2.1 語句和語句塊25
3.2.2 註釋26
3.2.3 變量26
3.2.4 常量27
3.2.5 數據類型27
3.2.6 運算符38
3.2.7 條件判斷42
3.2.8 循環語句43
3.2.9 Map 和Set 46
3.3 JavaScript 函數48
3.3.1 函數定義和調用48
3.3.2 變量作用域53
3.3.3 方法54
3.3.4 高階函數56
3.3.5 箭頭函數57
3.4 JavaScript 標準對象58
3.4.1 Date 58
3.4.2 RegExp 59
3.4.3 JSON 60
3.4.4 Math 61
3.5 本章小結62

4 熟練掌握WXML 和HTML. . . . . . . . . . . . . . . . . . . . . . . 63

4.1 WXML 和HTML 的差異63
4.2 WXML 語法65
4.2.1 數據綁定65
4.2.2 條件渲染70
4.2.3 列表渲染72
4.2.4 模板75
4.2.5 事件綁定77
4.2.6 引用81
4.3 WXSS 語法83
4.3.1 語法規則83
4.3.2 註釋83
4.3.3 選擇器84
4.4 WXSS 基本屬性85
4.5 CSS 和WXSS 的區別86
4.5.1 尺寸單位86
4.5.2 樣式導入87
4.5.3 內聯樣式87
4.5.4 全局樣式與局部樣式87
4.6 本章小結87
第三部分精通微信小程序開發
5 微信小程序開發基礎. . . . . . . . . . . . . . . . . 88

5.1 全局配置88
5.2 頁面配置93
5.3 註冊程序94
5.4 註冊頁面96
5.4.1 頁面的生命周期98
5.4.2 頁面的事件處理99
5.4.3 頁面的數據處理101
5.4.4 頁面的棧103
5.4.5 頁面的路由103
5.5 簡單封裝與調用104
5.6 本章小結106

6 Flexbox 佈局. . . . . . . . . .. . . . . . . . . . . . . . . . 107

6.1 基本要素107
6.2 容器屬性108
6.2.1 display 109
6.2.2 flex-direction 109
6.2.3 flex-wrap 110
6.2.4 flex-flow 110
6.2.5 justify-content 110
6.2.6 align-item 111
6.2.7 align-content 112
6.3 子元素屬性112
6.4 position 屬性115
6.5 邊框、空隙與填充120
6.6 本章小結121

7 組件的開發應用. . . . . . . . . .. . . . . . . . . 122

7.1 視圖容器組件124
7.1.1 view 124
7.1.2 scroll-view 126
7.1.3 swiper 129
7.2 基礎內容組件131
7.2.1 icon 132
7.2.2 text 132
7.2.3 progress 135
7.3 表單組件135
7.3.1 button 136
7.3.2 checkbox 138
7.3.3 radio 139
7.3.4 input 142
7.3.5 textarea 146
7.3.6 form 149
7.3.7 label 151
7.3.8 picker 154
7.3.9 picker-view 158
7.3.10 slider 160
7.3.11 switch 162
7.4 多媒體組件164
7.4.1 image 164
7.4.2 audio 167
7.4.3 video 170
7.5 地圖組件174
7.6 導航組件177
7.7 畫布組件179
7.8 客服會話按鈕182
7.9 本章小結183

8 API 接口. . . . . . . . . . . . . . .. . . . . . . . . . . 184

8.1 網絡相關185
8.1.1 發送請求185
8.1.2 上傳和下載187
8.1.3 WebSocket 189
8.2 多媒體193
8.2.1 圖片193
8.2.2 錄音196
8.2.3 音頻202
8.2.4 背景音樂204
8.2.5 音頻組件控制208
8.2.6 視頻209
8.2.7 視頻組件控制212
8.3 文件214
8.4 數據緩存218
8.5 位置224
8.5.1 獲取與查看位置224
8.5.2 地圖組件控制227
8.6 設備229
8.6.1 系統信息229
8.6.2 網絡狀態231
8.6.3 重力感應232
8.6.4 羅盤232
8.6.5 撥打電話233
8.6.6 掃描二維碼233
8.7 界面234
8.7.1 交互反饋234
8.7.2 設置導航條239
8.7.3 導航241
8.7.4 動畫246
8.7.5 繪畫254
8.7.6 下拉刷新256
8.8 開放接口257
8.8.1 登錄257
8.8.2 用戶信息263
8.8.3 微信支付266
8.8.4 模板消息267
8.8.5 客服消息272
8.8.6 分享275
8.8.7 獲取二維碼276
8.9 本章小結276

9 組件進階. . . . . . . . . . . . . . . . . .. . .. . . . . . . 277

9.1 九宮格278
9.2 頁腳280
9.3 加載更多283
9.4 導航條287
9.5 搜索條290
9.6 字母列表導航條295
9.7 日歷299
9.8 本章小結305
第四部分自己動手開發微信小程序

10 綜合案例——音樂播放小程序. . . .. . . . . . . . . 306

10.1 項目需求306
10.2 項目結構307
10.3 配置項目文件308
10.4 首頁index 308
10.4.1 推薦頁311
10.4.2 排行頁317
10.4.3 檢索頁（上） 325
10.4.4 檢索頁（中） 332
10.4.5 檢索頁（下） 340
10.5 列表頁346
10.5.1 獲取列表頁數據346
10.5.2 頁面渲染353
10.5.3 完成相似頁面357
10.6 音樂播放頁364
10.7 本章小結376
11 發布微信小程序. . . . . . . . . . . . . . . . . . . . . . . . 378
11.1 設置服務器域名378
11.2 上傳與審核步驟380
11.3 微信小程序數據分析382
11.4 常見問題及註意事項384
11.5 微信小程序審核不通過原因整理匯總386
11.6 本章小結388

附錄A . . .. . . . . . . . . . . . . . . . . . . .. . . . . . 389