微信小程序開發(fā)實戰(zhàn)

第1章 微信小程序入門 1
【教學導航】　1
1．1　初識微信小程序　1
1．1．1　什么是微信小程序　1
1．1．2　微信小程序的賬號　3
1．1．3　微信小程序的特點　4
1．1．4　微信小程序的發(fā)展前景　4
1．2　開發(fā)環(huán)境搭建　5
1．2．1　注冊微信公眾號　5
1．2．2　安裝微信開發(fā)者工具　7
1．3　小程序的開發(fā)體驗　8
1．3．1　創(chuàng)建項目　8
1．3．2　開發(fā)者工具的使用　9
1．3．3　目錄結構　11
1．3．4　項目設置　13
1．3．5　快捷鍵　14
1．4　團隊開發(fā)與項目上線　15
1．4．1　項目成員及權限　15
1．4．2　提交審核及發(fā)布　17
本章小結　17
課后習題　17
第2章　微信小程序開發(fā)基礎　19
【教學導航】　19
2．1　【案例1】比較數(shù)字大小　19
2．1．1　案例分析　19
2．1．2　創(chuàng)建項目　20
2．1．3　頁面組件　21
2．1．4　頁面樣式　23
2．1．5　配置文件　27
2．1．6　頁面邏輯　29
2．1．7　注冊程序　34
2．1．8　實現(xiàn)比較功能　35
2．2　【案例2】調查問卷　40
2．2．1　案例分析　40
2．2．2　編寫表單頁面　41
2．2．3　服務器數(shù)據(jù)交互　42
2．2．4　表單數(shù)據(jù)綁定　44
2．3　【案例3】計算器　46
2．3．1　案例分析　46
2．3．2　編寫計算器頁面　46
2．3．3　實現(xiàn)計算邏輯功能　50
本章小結　51
課后習題　51
第3章　“音樂”小程序項目　53
【教學導航】　53
3．1　開發(fā)前準備　53
3．1．1　項目展示　53
3．1．2　項目分析　54
3．1．3　項目初始化　55
3．2　【任務1】標簽頁切換　55
3．2．1　任務分析　55
3．2．2　前導知識　56
3．2．3　編寫頁面結構和樣式　58
3．2．4　實現(xiàn)標簽頁切換　60
3．3　【任務2】音樂推薦　61
3．3．1　任務分析　61
3．3．2　前導知識　62
3．3．3　內容區(qū)域滾動　65
3．3．4　輪播圖　66
3．3．5　功能按鈕　67
3．3．6　熱門音樂　68
3．4　【任務3】播放器　69
3．4．1　任務分析　69
3．4．2　前導知識　70
3．4．3　定義基礎數(shù)據(jù)　72
3．4．4　實現(xiàn)音樂播放功能　73
3．4．5　編寫播放器頁面　75
3．4．6　控制播放進度　76
3．5　【任務4】播放列表　78
3．5．1　任務分析　78
3．5．2　編寫頁面結構和樣式　79
3．5．3　實現(xiàn)換曲功能　80
本章小結　80
課后習題　80
第4章　“婚禮邀請函”小程序
項目　82
【教學導航】　82
4．1　開發(fā)前準備　82
4．1．1　項目展示　82
4．1．2　項目分析　84
4．1．3　項目初始化　84
4．2　【任務1】邀請函頁面　86
4．2．1　任務分析　86
4．2．2　背景音樂播放　87
4．2．3　頁面結構和樣式　89
4．2．4　一鍵撥打電話　91
4．3　【任務2】照片頁面　92
4．3．1　任務分析　92
4．3．2　實現(xiàn)縱向輪播圖　93
4．4　【任務3】美好時光頁面　93
4．4．1　任務分析　93
4．4．2　前導知識　94
4．4．3　編寫頁面結構和樣式　98
4．4．4　利用WXS增強頁面功能　98
4．5　【任務4】婚禮地點頁面　99
4．5．1　任務分析　99
4．5．2　前導知識　100
4．5．3　編寫婚禮地點頁面　103
4．6　【任務5】賓客信息頁面　103
4．6．1　任務分析　103
4．6．2　前導知識　103
4．6．3　編寫頁面結構和樣式　106
4．6．4　表單驗證　107
4．6．5　發(fā)送婚禮請?zhí)貜屯ㄖ?08
本章小結　112
課后習題　112
第5章　API應用案例（上）　114
【教學導航】　114
5．1　【案例1】用戶登錄　114
5．1．1　案例分析　114
5．1．2　前導知識　115
5．1．3　搭建開發(fā)者服務器　117
5．1．4　實現(xiàn)用戶登錄　119
5．1．5　檢查用戶是否已經(jīng)登錄　120
5．1．6　獲取用戶信息　121
5．1．7　開放數(shù)據(jù)校驗與解密　125
5．2　【案例2】個人中心　127
5．2．1　案例分析　127
5．2．2　前導知識　129
5．2．3　實現(xiàn)底部標簽頁切換　131
5．2．4　編輯個人資料　132
5．2．5　訂單物流查詢　135
5．2．6　選擇收貨地址　137
5．2．7　客服聯(lián)系電話　140
5．3　【案例3】天氣預報查詢　141
5．3．1　案例分析　141
5．3．2　前導知識　141
5．3．3　動態(tài)獲取輸入的城市名　142
5．3．4　請求天氣接口數(shù)據(jù)　142
5．3．5　渲染界面展示數(shù)據(jù)　143
5．4　【案例4】查看附近的
美食餐廳　143
5．4．1　案例分析　143
5．4．2　前導知識　144
5．4．3　設計地圖界面　147
5．4．4　單擊控件回到中心點　149
5．4．5　視野變化獲取中心點坐標　149
本章小結　150
課后習題　150
第6章　API應用案例（下）　152
【教學導航】　152
6．1　【案例5】模擬時鐘　152
6．1．1　案例分析　152
6．1．2　前導知識　153
6．1．3　鐘表頁面布局　156
6．1．4　鐘表頁面繪制　157
6．2　【案例6】羅盤動畫　160
6．2．1　案例分析　160
6．2．2　前導知識　160
6．2．3　設計羅盤界面布局　161
6．2．4　手指觸摸旋轉羅盤　162
6．2．5　單擊按鈕操作羅盤　163
6．3　【案例7】文件上傳與下載　165
6．3．1　案例分析　165
6．3．2　前導知識　165
6．3．3　錄音和上傳　167
6．3．4　文件的下載　168
6．4　【案例8】在線聊天系統(tǒng)　169
6．4．1　案例分析　169
6．4．2　前導知識　170
6．4．3　編寫Node．js服務器端代碼　172
6．4．4　實現(xiàn)通信功能　173
6．4．5　編寫聊天頁面　174
本章小結　177
課后習題　177
第7章　小程序開發(fā)框架　179
【教學導航】　179
7．1　小程序模塊化開發(fā)　179
7．1．1　模塊　179
7．1．2　模板　180
7．1．3　自定義組件　181
7．1．4　插件　184
7．2　小程序基礎樣式庫—
WeUI　187
7．2．1　初識WeUI　187
7．2．2　【案例】電影信息展示　187
7．3　使用Vue．js開發(fā)小程序—
mpvue　192
7．3．1　初識mpvue　192
7．3．2　開發(fā)工具　192
7．3．3　項目結構　194
7．3．4　【案例】計數(shù)器　195
7．4　小程序組件化開發(fā)框架—
WePY　196
7．4．1　初識WePY　197
7．4．2　開發(fā)工具　197
7．4．3　項目結構　198
7．4．4　【案例】商品展示　200
本章小結　201
課后習題　202
第8章　綜合項目—點餐
系統(tǒng)　203
【教學導航】　203
8．1　開發(fā)前準備　203
8．1．1　項目展示　203
8．1．2　項目分析　205
8．1．3　項目初始化　205
8．1．4　封裝網(wǎng)絡請求　207
8．2　【任務1】商家首頁　208
8．2．1　任務分析　208
8．2．2　焦點圖切換　208
8．2．3　中間區(qū)域單擊跳轉到菜單列表　209
8．2．4　底部商品展示　210
8．3　【任務2】菜單列表　210
8．3．1　任務分析　210
8．3．2　折扣信息區(qū)　211
8．3．3　設計菜單列表布局　211
8．3．4　請求數(shù)據(jù)　213
8．3．5　實現(xiàn)菜單欄聯(lián)動單品列表功能　213
8．4　【任務3】購物車　214
8．4．1　任務分析　214
8．4．2　設計底部購物車區(qū)域　214
8．4．3　添加商品到購物車　215
8．4．4　購物車界面　216
8．4．5　增加商品數(shù)量　218
8．4．6　減少商品數(shù)量　218
8．4．7　清空購物車　218
8．4．8　滿減優(yōu)惠　219
8．4．9　跳轉到訂單確認頁面　219
8．5　【任務4】訂單確認　220
8．5．1　任務分析　220
8．5．2　訂單信息　220
8．5．3　備注功能實現(xiàn)　221
8．5．4　支付功能　222
8．5．5　支付成功返回訂單列表　223
8．6　【任務5】訂單詳情　224
8．6．1　任務分析　224
8．6．2　取餐部分信息展示　225
8．6．3　訂單詳情部分　225
8．6．4　訂單信息部分　226
8．7　【任務6】訂單列表　227
8．7．1　任務分析　227
8．7．2　訂單列表設計　227
8．7．3　封裝數(shù)據(jù)請求　228
8．7．4　初始化頁面　229
8．7．5　下拉刷新功能　229
8．7．6　上拉觸底功能　230
8．8　【任務7】消費記錄　230
8．8．1　任務分析　230
8．8．2　設計消費記錄列表　231
本章小結　232
課后習題　232