內容提要
《實戰微信小程式：JavaScript、WXML與Flexbox綜合開發》從零開始介紹微信小程式的開發，內容從邏輯上可以分為4部分。第一部分（第1~第2章）主要介紹什麼是微信小程式，微信小程式的發展前景等。讓初學者快速了解微信小程式。第二部分（第3~第4章）主要介紹JavaScript和WXML，讓零基礎或者沒有學習過JavaScript的讀者在學習微信小程式的時候不會有語言障礙，能夠讀懂每一行代碼，為學習微信小程式開發打下基礎。第三部分（第5~第9章）是《實戰微信小程式：JavaScript、WXML與Flexbox綜合開發》的精髓，重點介紹了微信小程式的布局、組件、API接口等，詳細地闡述了微信小程式的所有功能實現。希望讀者能夠通過這部分內容的學習，熟練掌握微信小程式開發。第四部分（第10~第11章）通過詳細的案例分析，可以使讀者從項目開始到最後發布有一個系統的學習過程。
《實戰微信小程式：JavaScript、WXML與Flexbox綜合開發》內容深入淺出，適合零基礎、對微信小程式開發有興趣的人員，移動平台開發人員，JavaScript開發人員，有編程經驗想轉行做微信小程式的開發人員及計算機專業的學生。
目錄
第一部分認識微信小程式
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
