《Vue.js 3移動套用開發實戰》是清華大學出版社2022年出版的書籍，作者是綿綿的糖。
基本介紹
- 中文名：Vue.js 3移動套用開發實戰
- 作者：綿綿的糖
- 出版時間：2022年7月1日
- 出版社：清華大學出版社
- ISBN：9787302607793
- 類別：信息技術
- 定價：79
- 開本：16 開
內容簡介,目錄,
內容簡介
隨著前後端分離開發模式的出現，前端框架Vue、React、Angular相關生態的不斷完善，移動設備的普及，移動端Web App的開發成為主流，越來越多的大學逐步開設Web相關的課程。本書是一本為初學前端的學生量身定製的移動端Web開發入門教材，適合對移動端Web開發了解不多、沒有系統學過前端開發，但對前端編程感興趣的讀者學習使用。
本書分為13章，第1~2章主要介紹移動端Web技術的發展和移動端Web項目所需要的技術棧，包括安裝開發環境與調試代碼等；第3~10章主要介紹各種技術棧及第三方庫的基礎語法和使用方法等，涉及的技術棧及第三方庫包括Vue、Vuex、Webpack、Vue Router、Node.js、Mock.js、Vant Weapp、axios等，並在每章中都提供實戰案例或Demo；第11~12章分別給出2個實戰案例—回響式單頁面管理系統TODO和移動電商Web App；第13章介紹Web App轉為移動App的方法。
本書內容由淺到深、解析詳細、示例豐富，是廣大移動前端開發初學者的必備參考書，同時也非常適合作為高等院校和培訓機構的計算機及相關專業的教材。
目錄
第1章 什麼是移動端Web開發 1
1.1 移動網際網路Web技術的發展概況 1
1.2 移動端Web、PC Web、手機App開發的區別 2
1.3 移動端Web和HTML 3
1.4 環境搭建 6
1.4.1 選擇瀏覽器—Chrome 6
1.4.2 安裝Node.js和http-server 7
1.4.3 選擇代碼編輯器—IDE 11
1.5 實戰：第一個移動端Web頁面 11
1.6 Vue開發環境搭建 16
1.6.1 安裝Vue 16
1.6.2 運行Vue 17
1.7 本章小結 19
第2章 Vue移動端Web開發的技術棧 20
2.1 移動端Web技術棧的選擇 20
2.1.1 Webpack腳手架 20
2.1.2 Vue.js框架 25
2.1.3 Vuex狀態管理 34
2.1.4 Vue Router路由管理 35
2.1.5 ES6/ES7新標準 36
2.1.6 axios、Ajax和fetch 39
2.1.7 移動螢幕適配/移動UI 40
2.2 移動端Web的調試 42
2.2.1 Chrome模擬器調試 42
2.2.2 spy-debugger調試 44
2.3 本章小結 44
第3章 Webpack腳手架快速入門 45
3.1 Webpack簡介 45
3.1.1 Webpack功能 45
3.1.2 Webpack安裝 47
3.2 Webpack+Vue.js實戰 47
3.2.1 Webpack初始化項目 47
3.2.2 Webpack下的Vue.js項目檔案結構 49
3.3 本章小結 58
第4章 Vue快速入門 59
4.1 實例 59
4.2 組件 60
4.3 模板語法 63
4.4 方法、計算屬性和監聽器 68
4.4.1 方法 68
4.4.2 計算屬性 70
4.4.3 監聽器 71
4.5 動畫 74
4.6 插槽 84
4.6.1 插槽內容 84
4.6.2 插槽的渲染作用域 86
4.6.3 插槽的備用內容 87
4.6.4 具名插槽 87
4.6.5 作用域插槽 89
4.6.6 解構插槽props 91
4.6.7 動態插槽與具名插槽的縮寫 92
4.7 本章小結 93
第5章 Vuex快速入門 94
5.1 什麼是狀態管理模式 94
5.2 Vuex概述 95
5.2.1 Vuex的組成 96
5.2.2 安裝Vuex 96
5.2.3 一個簡單的store 97
5.3 state 99
5.4 Getters 101
5.5 Mutations 105
5.6 Actions 110
5.7 Modules 115
5.8 Vuex適用的場合 117
5.9 本章小結 124
第6章 Vue Router快速入門 125
6.1 什麼是單頁套用 125
6.2 Vue Router概述 126
6.2.1 安裝Vue Router 126
6.2.2 一個簡單的組件路由 127
6.3 動態路由 129
6.3.1 動態路由匹配 130
6.3.2 回響路由變化 131
6.4 導航守衛 133
6.4.1 全局前置守衛 134
6.4.2 全局解析守衛 136
6.4.3 全局後置鉤子函式 136
6.4.4 組件內的守衛 136
6.4.5 路由配置守衛 137
6.5 嵌套路由 141
6.6 命名視圖 144
6.7 編程式導航 147
6.8 路由組件傳參 148
6.9 路由重定向、別名及元信息 150
6.9.1 路由重定向 150
6.9.2 路由的別名 150
6.9.3 路由元信息 152
6.10 Vue Router的路由模式 153
6.10.1 hash模式 153
6.10.2 history模式 154
6.11 滾動行為 155
6.12 keep-alive 159
6.12.1 keep-alive快取狀態 159
6.12.2 keep-alive實現原理淺析 161
6.13 路由懶載入 163
6.14 本章小結 163
第7章 ES6/ES7快速入門 164
7.1 變數聲明 164
7.1.1 var、let、const關鍵字 164
7.1.2 箭頭函式 167
7.1.3 對象屬性和方法的簡寫 168
7.2 模組化 169
7.2.1 ES6模組化概述 169
7.2.2 import和export 170
7.3 async和await 171
7.4 本章小結 176
第8章 axios快速入門 177
8.1 什麼是axios 177
8.2 vue-axios的使用 177
8.2.1 安裝 177
8.2.2 第一個Demo 179
8.3 axios API 182
8.3.1 通過配置創建請求 182
8.3.2 使用請求方法的別名 183
8.3.3 創建axios實例 183
8.3.4 配置全局的axios默認值 184
8.3.5 請求和回響攔截器 184
8.4 回響結構 185
8.5 本章小結 187
第9章 移動端Web螢幕適配和UI框架 188
9.1 視區 188
9.1.1 物理像素和CSS像素 188
9.1.2 視區分類 189
9.1.3 設定視區 189
9.2 回響式布局 190
9.2.1 媒體查詢 190
9.2.2 案例：回響式頁面 193
9.3 Flex布局 196
9.3.1 Flex布局——新舊版本的兼容性 196
9.3.2 Flex容器屬性 196
9.3.3 Flex子元素屬性 201
9.3.4 Flex更便捷 205
9.4 rem適配 213
9.4.1 動態設定根元素font-size 213
9.4.2 計算rem數值 214
9.5 vw適配 215
9.6 rem適配和vw適配兼容性 216
9.7 移動UI框架的選擇 218
9.7.1 Vant 218
9.7.2 MUI 219
9.7.3 Jingle移動端框架 220
9.7.4 FrozenUI 221
9.8 本章小結 223
第10章 移動端Web單擊事件 224
10.1 touch事件 224
10.1.1 touch事件分類 224
10.1.2 touch事件對象 225
10.2 移動端Web單擊事件 228
10.2.1 iOS單擊延遲 229
10.2.2 單擊穿透的問題 229
10.3 本章小結 231
第11章 實戰項目：回響式單頁面管理系統TODO 232
11.1 創建index.html 232
11.2 創建根實例和頁面組件 233
11.3 頁面切換 235
11.4 待辦事項頁面的開發 236
11.4.1 創建事項 236
11.4.2 單條事項組件 237
11.4.3 數據持久化 239
11.5 資源回收筒頁面的開發 240
11.5.1 創建已刪除事項列表 240
11.5.2 創建單條已刪除事項組件 241
11.6 刪除事項和恢復事項聯動 242
11.7 美化頁面背景 242
11.8 本章小結 252
第12章 實戰項目：移動電商Web App 253
12.1 項目環境配置 253
12.1.1 初始化並整理項目 253
12.1.2 引入並實現Vant的按需載入 255
12.1.3 引入並封裝axios 255
12.1.4 使用Mock.js模擬數據接口 256
12.2 模擬數據接口 258
12.3 設計路由 262
12.4 底部tabbar 264
12.5 登錄頁、註冊頁實現 267
12.5.1 登錄頁實現 267
12.5.2 註冊頁實現 270
12.6 首頁實現 275
12.7 詳情頁實現 280
12.8 購物車頁實現 284
12.9 “我的”頁面實現 289
12.10 本章小結 292
第13章 實戰項目：Web App打包成移動端App 293
13.1 打包準備 293
13.2 使用HBuilderX打包手機端App 294
13.3 本章小結 298
