本書是一本系統介紹熱門前端多端框架uni-app的實用教程。全書共分7章,主要分為兩個部分。第一部分 基礎篇(第1-4章),內容包括初始uni-app、uni-app環(huán)境搭建、flex布局、生命周期、擴展組件安裝與使用、常用內置組件等知識點,每章都有一個綜合案例,展示如何在實際應用場景中應用本章知識點。第二部分 進階篇(第5-7章),內容包括uni-app的API接口和三個綜合案例:智云翻譯、音樂播放器、智慧環(huán)保。
本書全面貫徹黨的二十大精神,以新時代中國特色社會主義思想為引領,注重青年學生社會主義核心價值觀的培育,緊跟時代脈絡,把握青年學生發(fā)展規(guī)律和實際特點,開拓創(chuàng)造、守正創(chuàng)新。本書堅持立德樹人,自然融入課程思政、二十大精神,培養(yǎng)學生社會責任感、使命感。本書大量的實訓案例融入思政元素,旨在讓學生在實踐的過程中,掌握uni-app前端開發(fā)技能的同時,增強環(huán)保意識、法律意識、創(chuàng)新意識,增強學生的愛國熱情和社會責任感,能夠勇擔科教興國使命。
uni-app市面上的書籍較少,本教材注重實踐應用,每章都會提供比較完整的案例,最后完整的綜合案例。
教學資源豐富,教師易教。
各個實例、案例、實訓項目的操作步驟詳實,學生易學。
趙丙秀,副教授,現任職于武漢軟件工程職業(yè)學院信息學院軟件技術專業(yè),先后獲得 “武漢優(yōu)秀青年教師”,武漢軟件工程職業(yè)學院“雙師素質”教師、“優(yōu)秀中青年骨干教師”。 1. 《軟件測試技術教程》,主編,8萬字,2015年9月,電子工業(yè)出版社,ISBN978-7-121-26998-1 2.《VB程序設計》,副主編,8萬字,2013年6月,冶金工業(yè)出版社,ISBN978-7-5024-6352-6 3.《數據結構》,參編,5萬字,2013年7月,冶金工業(yè)出版社,ISBN978-7-5024-6356-4 4.《Linux操作系統配置與管理》,參編,2萬字,2013年7月,中國水利水電出版社,SBN?978-7-5170-0983-2
第 1章 初識uni-app1
本章導讀1
學習目標1
1.1 uni-app發(fā)展歷程2
1.1.1uni-app的由來2
1.1.2 uni-app的特點3
1.2 第 1個uni-app應用5
1.2.1 uni-app開發(fā)工具5
1.2.2 新建項目6
1.2.3 項目目錄結構7
1.2.4 運行項目10
1.3 uni-app打包14
1.3.1 打包原生App(云端)14
1.3.2 打包原生App(本地)16
1.3.3 發(fā)布為H516
1.3.4 發(fā)布為微信小程序17
1.4 案例:示例代碼18
本章小結19
項目實戰(zhàn)19
拓展實訓項目19
第 2章 uni-app基礎知識20
本章導讀20
學習目標20
2.1pages.json21
2.1.1 globalStyle和pages21
2.1.2 tabBar22
2.1.3 subPackages26
2.2 資源引用26
2.3頁面樣式28
2.4 尺寸單位28
2.5 基礎組件29
2.5.1 view29
2.5.2 text31
2.5.3 navigator32
2.5.4 image34
2.5.5 屬性綁定和事件綁定35
2.5.6 v-for渲染數據37
2.6 flex布局38
2.6.1 flex布局的基本概念38
2.6.2 容器屬性41
2.6.2 項目屬性56
2.7 案例:九宮格導航頁面62
本章小結66
項目實戰(zhàn)66
拓展實訓項目67
第3章 uni-app基礎擴展67
本章導讀67
學習目標67
3.1 生命周期68
3.1.1 應用生命周期68
3.1.2 頁面生命周期69
3.1.3 組件生命周期函數73
3.2 條件編譯73
3.3 擴展組件uni-ui76
3.3.1 安裝組件76
3.3.2 uni-scss輔助樣式80
3.3.3 使用組件84
3.4 案例:新聞列表87
本章小結90
實訓項目90
拓展實訓項目91
第4章 uni-app組件91
本章導讀91
學習目標91
4.1容器組件92
4.1.1scroll-view92
4.1.2 swiper96
4.2基礎組件101
4.2.1 rich-text101
4.2.2 progress104
4.3 表單組件106
4.3.1 button106
4.3.3 picker110
4.3.4 slider115
4.3.5 input117
4.3.6 radio和checkbox121
4.3.8 switch125
4.3.9 textarea127
4.3.10 form130
4.4 媒體組件133
4.4.1 camera133
4.4.2 video134
4.5地圖138
4.6案例一:典型注冊頁139
4.7案例二:典型個人中心頁143
本章小結147
實訓項目147
拓展實訓項目147
第5章 常用API148
本章導讀148
學習目標148
5.1 API概述149
5.2 計時器150
5.2.1設置計時器150
5.2.2 取消計時器150
5.3 交互反饋153
5.3.1 信息提示框153
5.3.2 loading提示框156
5.3.3 模態(tài)框156
5.3.4 操作菜單158
5.4 網絡159
5.4 .1 request發(fā)起請求159
3. Success屬性的回調函數參數說明如表5-8所示。161
5.4.2 上傳文件163
5.5 數據緩存166
5.5.1 將數據緩存到本地167
5.5.2 獲取本地緩存數據168
5.5.3 清理本地緩存數據170
5.6路由174
5.6.1 路由API174
5.6.2 數據傳遞177
5.7 案例:智云翻譯178
本章小結193
項目實戰(zhàn)193
拓展實訓項目194
第6章 常用API-2194
本章導讀194
學習目標194
6.1 媒體控制195
6.1.1 音頻組件控制195
6.1.2 錄音管理203
6.1.3 圖片209
6.1.4 視頻組件控制212
6.1.5 相機組件控制216
6.2 文件操作218
6.2.1 文件保存218
6.2.2 文件選擇219
6.3 設備219
6.3.1 得到系統信息219
6.3.2 掃碼220
6.3.3 撥打電話223
6.3.4剪貼板223
6.4 登錄224
6.5 案例:仿網易云播放器226
本章小結244
項目實戰(zhàn)244
拓展實訓項目245
第7章 智慧環(huán)保246
本章導讀246
學習目標246
7.1 項目介紹247
7.1.1項目概述247
7.1.2 項目演示效果247
7.2 環(huán)境配置252
7.2.1 安裝json-server252
7.2.2 配置json-server254
7.3 項目開發(fā)256
7.3.1 創(chuàng)建初始項目256
7.3.2 首頁260
7.3.3 回收分類、分類搜索266
7.3.4 注冊、登錄、個人中心274
7.3.5 公司回收、公司詳情、搜索結果285
7.3.6 下單、訂單頁、訂單詳情293
本章小結310
項目實戰(zhàn)310
拓展實訓項目311