Vue是一款用于構建用戶界面的漸進式框架，現已成為Web前端開發領域三大主流框架之一。2020年9月，Vue 3正式發布，目前其在國內Web前端開發（尤其是手機App的HTML5頁面開發）領域已被廣泛應用。
本書共16章，內容分為四部分，即Vue概述、Vue基礎、Vue生態和Vue實戰，從基礎知識到實戰項目，全面系統地介紹Vue技術，且涵蓋目前新一代企業級狀態管理庫Pinia和下一代前端構建工具Vite。本書內容由淺入深，實例豐富實用，實戰部分通過一個通用的Vue 3項目腳手架實例和一個基于Vue 3 + Vant的項目實例（易學、易用、易上手）來幫助讀者將所學知識更好地應用到實際開發工作中，快速培養獨立完成基于Vue 3的企業級應用開發與迭代能力。
本書可作為Web前端開發相關課程的教材，也可供廣大信息技術類專業的學習者參考使用，還可作為Web前端開發相關領域培訓機構的教材。
1. Web前端開發工程師團隊精心打磨新品力作。
2. 精選綜合實例，剖析工程代碼；緊跟前沿技術，配套豐富資源。
3. 知識架構合理，示例項目豐富，綜合實例升華，接軌企業應用。
4. 配套PPT、教學大綱、教案、源代碼、習題答案及各種參考文件等教輔資源。
孫芳：
遼寧師范大學副教授，畢業于大連理工大學計算機系，CCF計算機應用專業委員會委員，遼寧省大連市西崗區智慧聯盟特聘專家；常年從事高校計算機專業課程的一線教學工作，并具有多年海外跨國公司IT工作經驗，主要從事軟件工程、Web開發、智能信息處理、多媒體信息安全等方面的研究；主持并參與多項課題，主編出版多部高校優秀教材。
梁大業：
騰訊前端架構師，騰訊前端通道會長，騰訊技術委員會委員，騰訊安全委員會委員；專注于Web前端領域，主要負責前端架構搭建技術選型，并且擁有多年前端開發實戰經驗；參與編寫Web開發相關領域圖書多部。
【章名目錄】
第 1章 Vue前世今生
第 2章 第 一個Vue項目實例
第3章 Vue生命周期
第4章 Vue指令
第5章 Vue組件
第6章 計算屬性和偵聽器
第7章 樣式綁定和過渡動畫
第8章 混入
第9章 組合式API
第 10章 Vue Router
第 11章 Pinia—— 一個全新的狀態管理庫
第 12章 Vite——下一代前端構建工具
第 13章 Axios—— 一個HTTP網絡請求庫
第 14章 Vue組件庫
第 15章 Vue 3+Vue Router+Vite+Pinia+Axios+Element Plus項目腳手架實例
第 16章 一個基于Vue 3+Vant的HTML5版考拉商城
【詳細目錄】
第 1章 Vue前世今生
1.1 Vue簡介 2
1.2 Vue產生的背景 3
1.2.1 jQuery一統天下的時代 3
1.2.2 從jQuery到Vue的思維轉變 4
1.3 Vue的學習方法 6
1.3.1 Vue前置知識的準備 6
1.3.2 開發工具介紹 9
1.4 Vue 3的特點 11
1.5 本章小結 11
習題 12
第 2章 第 一個Vue項目實例
2.1 搭建開發環境 13
2.1.1 安裝Node.js 13
2.1.2 安裝Vue Devtools 15
2.2 創建Vue 3項目示例 17
2.2.1 創建一個單頁面項目 17
2.2.2 運行及構建項目 18
2.3 詳解HelloWorld項目 20
2.3.1 整體項目結構 20
2.3.2 src項目源文件目錄 20
2.3.3 項目主要文件源代碼詳解 21
2.4 本章小結 22
習題 22
上機實操 23
第3章 Vue生命周期
3.1 生命周期函數 25
3.1.1 鉤子函數詳細描述與使用場景 25
3.1.2 Vue 2與Vue 3生命周期鉤子函數對比 27
3.2 生命周期代碼示例 27
3.3 本章小結 29
習題 29
上機實操 30
第4章 Vue指令
4.1 Vue指令簡介 31
4.2 內置指令 32
4.2.1 條件渲染 32
4.2.2 循環渲染 33
4.2.3 數據插入 34
4.2.4 屬性綁定 35
4.2.5 事件綁定 36
4.2.6 雙向數據綁定 38
4.2.7 插槽 39
4.2.8 性能提升相關指令 40
4.3 自定義指令 42
4.3.1 自定義指令使用場景 42
4.3.2 創建與使用自定義指令 42
4.3.3 生命周期鉤子函數 43
4.3.4 自定義指令應用示例 44
4.4 本章小結 46
習題 47
上機實操 47
第5章 Vue組件
5.1 組件簡介 48
5.2 注冊組件與使用組件 50
5.2.1 注冊組件 50
5.2.2 使用組件 51
5.3 Props與組件間通信 53
5.3.1 Props 54
5.3.2 組件間通信 55
5.4 插槽 58
5.4.1 默認插槽 58
5.4.2 具名插槽 59
5.4.3 作用域插槽 59
5.5 組件間切換 61
5.5.1 條件渲染 61
5.5.2 動態組件 62
5.6 內置組件 63
5.6.1 Transition 63
5.6.2 Teleport 63
5.6.3 Suspense 64
5.6.4 Keep-alive 65
5.7 本章小結 66
習題 66
上機實操 67
第6章 計算屬性和偵聽器
6.1 計算屬性 68
6.1.1 計算屬性簡介 68
6.1.2 計算屬性與方法的對比 69
6.1.3 計算屬性的用法 70
6.1.4 計算屬性的使用示例 73
6.2 偵聽器 76
6.2.1 偵聽器簡介 76
6.2.2 偵聽器的用法 77
6.2.3 偵聽器的使用示例 80
6.3 本章小結 84
習題 85
上機實操 86
第7章 樣式綁定和過渡動畫
7.1 樣式綁定 87
7.1.1 :class指令 87
7.1.2 :style指令 89
7.1.3 動態綁定Class 90
7.1.4 動態綁定Style 90
7.1.5 動態綁定樣式對象 90
7.2 過渡動畫 91
7.2.1 基本用法 91
7.2.2 高級用法 93
7.2.3 應用示例 96
7.3 本章小結 99
習題 99
上機實操 99
第8章 混入
8.1 混入簡介 100
8.2 混入的定義 100
8.3 混入的使用 101
8.4 混入的完整示例 101
8.5 混入選項的合并規則 102
8.6 混入的使用建議 104
8.7 本章小結 104
習題 104
上機實操 105
第9章 組合式API
9.1 使用組合式API的動機和優勢 106
9.1.1 動機 106
9.1.2 優勢 108
9.2 組合式API的核心概念 111
9.2.1 setup函數 111
9.2.2 reactive API 113
9.2.3 ref API 115
9.3 組合式API與混入比較 116
9.3.1 兩者的區別 116
9.3.2 代碼示例 116
9.4 本章小結 117
習題 118
上機實操 119
第 10章 Vue Router
10.1 Vue Router入門 121
10.1.1 前端路由的概述 121
10.1.2 Vue Router概述 122
10.1.3 Vue Router安裝與配置 123
10.2 靜態路由與動態路由 124
10.2.1 靜態路由 124
10.2.2 動態路由 126
10.2.3 路由傳參 127
10.3 路由守衛 128
10.3.1 路由守衛概述 128
10.3.2 全局前置守衛 129
10.3.3 路由獨享守衛 130
10.3.4 組件內的守衛 132
10.4 路由的過渡動畫 133
10.4.1 過渡動畫概述與分類 134
10.4.2 漸變過渡動畫 134
10.4.3 幻燈片過渡動畫 135
10.4.4 縮放過渡動畫 137
10.4.5 旋轉過渡動畫 138
10.4.6 自定義過渡動畫 140
10.5 本章小結 141
習題 142
上機實操 142
第 11章 Pinia—— 一個全新的狀態管理庫
11.1 認識Pinia 143
11.1.1 狀態管理簡介 143
11.1.2 選擇Pinia的理由 143
11.2 安裝與配置 144
11.2.1 安裝Pinia 144
11.2.2 創建Pinia實例 144
11.2.3 定義Store 145
11.2.4 使用Store 145
11.2.5 提供Store 145
11.3 狀態管理基礎 146
11.3.1 創建和注冊Store 146
11.3.2 State和Getters 146
11.3.3 $patch 147
11.3.4 Actions 148
11.4 在Vue組件中使用Pinia 150
11.4.1 在組件中獲取狀態 150
11.4.2 使用$patch和Actions更新狀態 151
11.4.3 輔助函數和輔助Hook 151
11.5 高級技巧與實踐 153
11.5.1 異步操作與副作用處理 153
11.5.2 跨Store數據共享 154
11.5.3 插件開發和使用 155
11.5.4 單元測試Pinia應用程序 156
11.5.5 完整實踐 156
11.6 本章小結 158
習題 159
上機實操 159
第 12章 Vite——下一代前端構建工具
12.1 Vite概述 160
12.1.1 Vite的由來和特點 160
12.1.2 Vite與Vue 3結合的優勢 160
12.2 環境搭建與項目創建 161
12.2.1 安裝與配置Vite 161
12.2.2 Vite項目結構解析 162
12.2.3 Vite配置選項詳解 163
12.2.4 Vite項目開發與構建 163
12.3 本章小結 164
習題 165
上機實操 165
第 13章 Axios—— 一個HTTP網絡請求庫
13.1 Axios概述 166
13.1.1 認識Axios與Axios的優勢 166
13.1.2 Axios的安裝與配置 167
13.1.3 發起請求與處理響應 167
13.2 Vue 3中的Axios實例 170
13.2.1 在Vue組件中使用Axios 170
13.2.2 Axios結合Vue Router的異步加載數據 171
13.2.3 Pinia中的異步數據管理與Axios 171
13.3 Axios公共邏輯與封裝 173
13.3.1 創建可復用的Axios封裝 173
13.3.2 處理請求的Loading狀態 175
13.3.3 統一處理錯誤提示與日志記錄 176
13.3.4 優化Axios封裝與配置 177
13.4 安全性與性能優化 178
13.4.1 有關網絡請求的安全性 178
13.4.2 性能優化 179
13.5 本章小結 179
習題 179
上機實操 180
第 14章 Vue組件庫
14.1 Element Plus 181
14.1.1 Element Plus簡介 181
14.1.2 Element Plus入門 182
14.1.3 Element Plus常用組件 185
14.1.4 Element Plus布局組件 193
14.1.5 Element Plus高級組件 196
14.1.6 項目實踐 —— 一個簡單的后臺管理系統 200
14.2 Vant 203
14.2.1 Vant簡介 203
14.2.2 Vant快速入門 203
14.2.3 Vant基礎組件 207
14.2.4 Vant布局組件 211
14.2.5 Vant業務組件 214
14.2.6 項目實踐——一個移動端購物車界面 220
14.3 本章小結 223
習題 224
上機實操 224
第 15章 Vue 3+Vue Router+Vite+Pinia+Axios+Element Plus項目腳手架實例
15.1 創建新的Vue 3項目 226
15.1.1 使用Vue 3腳手架創建新項目 226
15.1.2 安裝項目依賴包 227
15.2 集成Element Plus 228
15.3 集成Axios 229
15.4 多環境配置 232
15.5 項目結構詳解 235
15.6 本章小結 236
習題 236
上機實操 236
第 16章 一個基于Vue 3+Vant的HTML5版考拉商城
16.1 商城前端架構搭建 237
16.1.1 Vue 3與Vant集成 237
16.1.2 項目結構詳解 243
16.2 項目公用文件 244
16.2.1 assets靜態資源文件目錄 244
16.2.2 common公用目錄 246
16.2.3 App.vue根組件 252
16.3 首頁 254
16.3.1 頭部搜索欄 254
16.3.2 輪播圖 256
16.3.3 功能導航模塊 257
16.3.4 新品上線模塊 258
16.3.5 熱門商品模塊 260
16.3.6 最新推薦模塊 261
16.3.7 效果優化 262
16.3.8 底部導航欄 262
16.3.9 添加路由 264
16.4 登錄頁面和注冊頁面 264
16.4.1 添加路由 264
16.4.2 頭部導航欄 265
16.4.3 登錄頁面和注冊頁面模塊 266
16.5 “我的”頁面 272
16.5.1 首頁登錄狀態細節 272
16.5.2 添加路由 273
16.5.3 “我的”頁面模塊 273
16.6 商品列表頁面 275
16.6.1 添加路由 276
16.6.2 頭部搜索欄 276
16.6.3 Tabs欄 277
16.6.4 商品列表欄 278
16.6.5 頁面邏輯代碼實現 280
16.7 商品詳情頁面 282
16.7.1 添加路由 282
16.7.2 商品詳情模塊 282
16.7.3 底部工具欄 285
16.8 購物車頁面 288
16.8.1 添加路由 288
16.8.2 購物車列表模塊 289
16.8.3 底部結算模塊 293
16.9 地址管理頁面 294
16.9.1 地址列表頁面 294
16.9.2 編輯地址頁面 297
16.10 生成訂單頁面 300
16.10.1 添加路由 301
16.10.2 訂單接口 301
16.10.3 地址欄 301
16.10.4 商品列表模塊 303
16.10.5 生成訂單模塊 305
16.10.6 支付彈窗模塊 306
16.11 “我的訂單”頁面 307
16.11.1 創建頁面 307
16.11.2 定義路由 310
16.12 訂單詳情頁面 311
16.12.1 定義路由 311
16.12.2 創建頁面 311
16.13 分類頁面 315
16.13.1 定義路由 315
16.13.2 區域滾動組件 316
16.13.3 創建頁面 317
16.14 本章小結 319
習題 319
上機實操 320
新書資訊