Vue.js 3.0 從入門到精通 (視頻教學版)

李小威，軟件開發項目經理，在軟件開發有多年的開發經驗，尤其擅長Java、PHP、數據庫、大數據分析等，具有很強的實戰經驗。
對多種數據庫系統有深入研究，在數據庫管理與開發方面有著豐富的經驗。
並已出版過多本相關暢銷書，頗受廣大讀者認可。

目錄
第1章  快速進入Vue.js的世界 1
1.1  前端開發技術的發展 1
1.2  MV*模式 2
1.2.1  MVC模式 2
1.2.2  MVVM模式 2
1.3  Vue.js概述 3
1.4  Vue.js的發展歷程 5
1.5  Vue.js 3.0的新變化 5
1.6  疑難解惑 7

第2章  搭建開發與調試環境 8
2.1  安裝Vue.js 8
2.1.1  使用CDN方式 8
2.1.2  NPM 9
2.1.3  命令行工具（CLI） 9
2.1.4  使用Vite方式 10
2.2  安裝WebStorm 10
2.3  安裝vue-devtools 15
2.4  第一個Vue.js程序 17
2.5  疑難解惑 20

第3章  熟悉ECMAScript 6語法 21
3.1  ECMAScript 6介紹 21
3.1.1  ES6的前世今生 21
3.1.2  為什麽要使用ES6 22
3.2  塊作用域構造let和const 22
3.3  模板字面量 24
3.3.1  Multi-line Strings（多行字符串） 24
3.3.2  字符串占位符 24
3.4  默認參數和rest參數 24
3.5  解構賦值 25
3.6  展開運算符 26
3.7  增強的對象文本 27
3.8  箭頭函數 29
3.9  Promise 實現 30
3.10  Classes（類） 30
3.11  Modules（模塊） 31
3.12  精簡壓縮生產環境的webpack 31
3.12.1  webpack是什麽 31
3.12.2  配置一個完整項目的webpack 32
3.13  疑難解惑 33

第4章  熟悉Vue.js的語法 35
4.1  創建應用程序實例 35
4.2  插值 37
4.3  方法選項 40
4.3.1  使用方法 40
4.3.2  傳遞參數 41
4.3.3  方法之間調用 42
4.4  生命周期鉤子函數 43
4.4.1  認識生命周期鉤子函數 44
4.4.2  created和mouted 46
4.5  指令 47
4.6  縮寫 49
4.7  Vue.js 3.0的新變化——取消構造函數 50
4.8  疑難解惑 50

第5章  指令 52
5.1  內置指令 52
5.1.1  v-show 52
5.1.2  v-if/v-else-if/v-else 53
5.1.3  v-for 55
5.1.4  v-bind 67
5.1.5  v-model 68
5.1.6  v-on 70
5.1.7  v-text 71
5.1.8  v-html 72
5.1.9  v-once 73
5.1.10  v-pre 73
5.1.11  v-cloak 74
5.2  自定義指令 75
5.2.1  註冊自定義指令 75
5.2.2  鉤子函數 76
5.2.3  動態指令參數 78
5.3  綜合案例——通過指令實現下拉菜單效果 79
5.4  疑難解惑 82

第6章  計算屬性 83
6.1  使用計算屬性 83
6.2  計算屬性的getter和setter方法 85
6.3  計算屬性的緩存 86
6.4  使用計算屬性代替v-for和v-if 89
6.5  綜合案例——使用計算屬性設計購物車效果 90
6.6  疑難解惑 93

第7章  精通監聽器 94
7.1  使用監聽器 94
7.2  監聽方法 95
7.3  監聽對象 96
7.4  綜合案例——使用監聽器設計購物車效果 99
7.5  疑難解惑 101

第8章  事件處理 102
8.1  監聽事件 102
8.2  事件處理方法 103
8.3  事件修飾符 106
8.3.1  stop 107
8.3.2  capture 109
8.3.3  self 111
8.3.4  once 112
8.3.5  prevent 113
8.3.6  passive 114
8.4  按鍵修飾符 114
8.5  系統修飾鍵 117
8.6  綜合案例——處理用戶註冊信息 118
8.7  疑難解惑 119

第9章  class與style綁定 120
9.1  綁定HTML樣式（class） 120
9.1.1  數組語法 120
9.1.2  對象語法 122
9.1.3  用在組件上 126
9.2  綁定內聯樣式（style） 126
9.2.1  對象語法 126
9.2.2  數組語法 129
9.3  綜合案例——設計隔行變色的商品表 130
9.4  疑難解惑 132

第10章  表單輸入綁定 133
10.1  實現雙向數據綁定 133
10.2  單行文本輸入框 133
10.3  多行文本輸入框 134
10.4  復選框 135
10.5  單選按鈕 137
10.6  選擇框 138
10.7  值綁定 140
10.7.1  復選框 141
10.7.2  單選框 141
10.7.3  選擇框的選項 142
10.8  修飾符 143
10.8.1  lazy 143
10.8.2  number 144
10.8.3  trim 145
10.9  綜合案例——設計用戶註冊頁面 145
10.10  疑難解惑 147

第11章  組件和組合API 149
11.1  組件是什麽 149
11.2  組件的註冊 150
11.2.1  全局註冊 150
11.2.2  局部註冊 151
11.3  使用prop向子組件傳遞數據 152
11.3.1  prop基本用法 152
11.3.2  單向數據流 155
11.3.3  prop驗證 156
11.3.4  非prop的屬性 157
11.4  子組件向父組件傳遞數據 159
11.4.1  監聽子組件事件 159
11.4.2  將原生事件綁定到組件 161
11.4.3  .sync修飾符 162
11.5  插槽 164
11.5.1  插槽基本用法 164
11.5.2  編譯作用域 165
11.5.3  默認內容 165
11.5.4  命名插槽 166
11.5.5  作用域插槽 169
11.5.6  解構插槽prop 171
11.6  Vue.js 3.0的新變化1——組合API 172
11.7  setup()函數 173
11.8  響應式API 174
11.8.1  reactive()方法和watchEffect()方法 174
11.8.2  ref()方法 175
11.8.3  readonly()方法 176
11.8.4  computed()方法 176
11.8.5  watch()方法 177
11.9  Vue.js 3.0的新變化2——訪問組件的方式 178
11.10  綜合案例——使用組件創建樹狀項目分類 179
11.11  疑難解惑 180

第12章  過渡和動畫效果 181
12.1  單元素/組件的過渡 181
12.1.1  CSS 過渡 181
12.1.2  過渡的類名 183
12.1.3  CSS動畫 186
12.1.4  自定義過渡的類名 187
12.1.5  動畫的JavaScript鉤子函數 188
12.2  初始渲染的過渡 191
12.3  多個元素的過渡 193
12.4  列表過渡 194
12.4.1  列表的進入/離開過渡 194
12.4.2  列表的排序過渡 195
12.4.3  列表的交錯過渡 197
12.5  綜合案例1——商品編號增加器 198
12.6  綜合案例2——設計下拉菜單的過渡動畫 200
12.7  疑難解惑 202

第13章  精通Vue CLI和Vite 203
13.1  腳手架的組件 203
13.2  腳手架環境搭建 204
13.3  安裝腳手架 207
13.4  創建項目 207
13.4.1  使用命令 207
13.4.2  使用圖形化界面 210
13.5  分析項目結構 214
13.6  配置Scss、Less和Stuly 216
13.7  配置文件package.json 219
13.8  Vue 3.0新增開發構建工具——Vite 220
13.9  疑難解惑 222

第14章  使用Vue Router開發單頁面應用 223
14.1  使用Vue Router 223
14.1.1  HTML頁面使用路由 223
14.1.2  項目中使用路由 228
14.2  命名路由 230
14.3  命名視圖 232
14.4  路由傳參 236
14.5  編程式導航 240
14.6  組件與Vue Router間解耦 244
14.6.1  布爾模式 244
14.6.2  對象模式 247
14.6.3  函數模式 250
14.7  疑難解惑 25

第15章  數據請求庫—axios 252
15.1  什麽是axios 252
15.2  安裝axios 253
15.3  基本用法 253
15.3.1  axios的get請求和post請求 253
15.3.2  請求JSON數據 255
15.3.3  跨域請求數據 256
15.3.4  並發請求 258
15.4  使用axios創建請求 259
15.5  請求配置 260
15.6  創建實例 263
15.7  配置默認選項 263
15.8  攔截器 264
15.9  Vue.js 3.0的新變化—替代Vue.prototype 264
15.10  綜合案例—顯示近7日的天氣情況 265
15.11  疑難解惑 267

第16章  狀態管理—Vuex 268
16.1  什麽是Vuex 268
16.2  安裝Vuex 269
16.3  在項目中使用Vuex 270
16.3.1  搭建一個項目 270
16.3.2  state對象 273
16.3.3  getter對象 274
16.3.4  mutation對象 276
16.3.5  action對象 278
16.4  疑難解惑 280

第17章  網上購物商城開發實戰 282
17.1  系統功能結構 282
17.2  系統結構分析 283
17.3  系統運行效果 283
17.4  系統功能模塊設計與實現 284
17.4.1  首頁模塊 284
17.4.2  首頁信息展示模塊 285
17.4.3  用戶登錄模塊 288
17.4.4  商品模塊 290
17.4.5  購買模塊 295
17.4.6  支付模塊 297

第18章  電影購票APP開發實戰 299
18.1  腳手架項目的搭建 299
18.2  系統結構 300
18.3  系統運行效果 300
18.4  設計項目組件 302
18.4.1  設計頭部和底部導航組件 302
18.4.2  設計電影頁面組件 303
18.4.3  設計影院頁面組件 310
18.4.4  設計我的頁面組件 312
18.5  設計項目頁面組件及路由配置 313
18.5.1  電影頁面組件及路由 313
18.5.2  影院頁面組件及路由 314
18.5.3  我的頁面組件及路由 315