Vue.js權威指南

第1章 遇見Vue.js 1
1.1 MVX模式是什麼 1
1.1.1 MVC 1
1.1.2 MVP 2
1.1.3 MVVM 3
1.2 Vue.js是什麼 4
1.2.1 Vue.js與其他框架的區別 4
1.2.2 如何使用Vue.js 10
1.2.3 Vue.js的發展歷史 11
第2章 數據綁定 12
2.1 語法 12
2.1.1 插值 12
2.1.2 表達式 13
2.1.3 指令 13
2.2 分隔符 14
第3章 指令 15
3.1 內部指令 15
3.1.1 v—if 15
3.1.2 v—show 16
3.1.3 v—else 17
3.1.4 v—model 18
3.1.5 v—repeat 20
3.1.6 v—for 29
3.1.7 v—text 37
3.1.8 v—html 37
3.1.9 v—bind 38
3.1.10 v—on 39
3.1.11 v—ref 40
3.1.12 v—el 40
3.1.13 v—pre 41
3.1.14 v—cloak 41
3.2 自定義指令 41
3.2.1 基礎 42
3.2.2 選項 46
3.3 內部指令解析 51
3.4 常見問題解析 53
第4章 計算屬性 56
4.1 什麼是計算屬性 56
4.2 計算屬性緩存 57
4.3 常見問題 59
4.3.1 計算屬性getter不執行的場景 59
4.3.2 在v—repeat中使用計算屬性 60
第5章 表單控件綁定 62
5.1 基本用法 62
5.1.1 text 62
5.1.2 checkbox 62
5.1.3 radio 63
5.1.4 select 63
5.2 值綁定 65
5.3 v—model修飾指令 66
5.3.1 lazy 66
5.3.2 debounce 67
5.3.3 number 67
5.4 修飾指令原理 67
5.4.1 lazy源碼解析 67
5.4.2 debounce源碼解析 68
5.4.3 number源碼解析 69
第6章 過濾器 70
6.1 內置過濾器 71
6.1.1 字母操作 71
6.1.2 json過濾器 72
6.1.3 限制 72
6.1.4 currency過濾器 75
6.1.5 debounce過濾器 76
6.2 自定義過濾器 76
6.2.1 fillter語法 76
6.2.2 教你寫一個filter 78
6.3 源碼解析 79
6.3.1 管道實現 79
6.3.2 過濾器解析 80
6.4 常見問題解析 80
第7章 Class與Style綁定 82
7.1 綁定HTML Class 82
7.1.1 對象語法 82
7.1.2 數組語法 84
7.2 綁定內聯樣式 84
7.2.1 對象語法 84
7.2.2 數組語法 85
7.2.3 自動添加前綴 86
第8章 過渡 88
8.1 CSS過渡 89
8.1.1 內置Class類名 90
8.1.2 自定義CSS類名 91
8.1.3 顯式聲明CSS過渡類型 91
8.1.4 動畫案例 91
8.1.5 過渡流程 92
8.2 過渡 94
8.3 漸進過渡 95
第9章 Method 97
9.1 如何綁定事件 97
9.1.1 內聯方式 97
9.1.2 methods配置 98
9.1.3 ＄events應用 99
9.2 如何使用修飾符 99
9.2.1 prevent 100
9.2.2 ……
9.2.3 capture 100
9.2.4 self 100
9.2.5 按鍵 101
9.3 Vue.js 0.12到1.0中的變化 101
9.3.1 v—on變更 101
9.3.2 @click縮寫 102
第10章 Vue實例方法 103
10.1 實例屬性 103
10.1.1 組件樹訪問 103
10.1.2 DOM訪問 104
10.1.3 數據訪問 104
10.2 實例方法 104
10.2.1 實例DOM方法的使用 104
10.2.2 實例Event方法的使用 106
第11章 組件 108
11.1 基礎 109
11.1.1 注冊 109
11.1.2 數據傳遞 111
11.1.3 混合 124
11.1.4 動態組件 127
11.2 相關拓展 130
11.2.1 組件和v—for 130
11.2.2 編寫可復用組件 131
11.2.3 異步組件 131
11.2.4 資源命名約定 132
11.2.5 內聯模板 133
11.2.6 片段實例 134
11.3 生命周期 135
11.4 開發組件 137
11.4.1 基礎組件 137
11.4.2 基於第三方組件開發 142
11.5 常見問題解析 147
第12章 表單校驗 154
12.1 安裝 154
12.2 基本使用 155
12.3 驗證結果結構 156
12.4 驗證器語法 158
12.4.1 校驗字段名field 158
12.4.2 校驗規則定義 160
12.5 內置驗證規則 163
12.5.1 required 163
12.5.2 pattern 165
12.5.3 minlength 165
12.5.4 maxlength 166
12.5.5 min 167
12.5.6 max 167
12.6 與v—model同時使用 168
12.7 重置校驗結果 169
12.8 表單元素 169
12.9 各校驗狀態對應的class 172
12.9.1 自定義校驗狀態class 173
12.9.2 在其他元素上使用校驗狀態class 173
12.10 分組校驗 174
12.11 錯誤信息 174
12.11.1 錯誤信息輸出組件 177
12.11.2 動態設置錯誤信息 180
12.12 事件 182
12.12.1 單個字段校驗事件 182
12.12.2 整個表單校驗事件 183
12.13 延遲初始化 185
12.14 自定義驗證器 186
12.14.1 注冊自定義驗證器 187
12.14.2 錯誤信息 188
12.15 自定義驗證時機 189
12.16 異步驗證 192
12.16.1 注冊異步驗證器 192
12.16.2 驗證器函數context 194
第13章 與服務端通信 196
13.1 vue—resource安裝及配置 197
13.1.1 安裝 197
13.1.2 參數配置 198
13.1.3 headers配置 199
13.1.4 基本HTTP調用 200
13.1.5 請求選項對象 202
13.1.6 response對象 205
13.1.7 RESTful調用 205
13.1.8 攔截器 207
13.1.9 跨域AJAX 208
13.1.10 Promise 210
13.1.11 url模板 211
13.2 vue—async—data 212
13.2.1 安裝 212
13.2.2 使用 212
13.3 常見問題解析 213
13.3.1 如何發送JSONP請求 213
13.3.2 如何修改發送給服務端的數據類型 215
13.3.3 跨域請求出錯 215
13.3.4 ＄.http.post方法變為OPTIONS方法 216
第14章 路由與視圖 217
14.1 如何安裝 217
14.2 基本使用 218
14.3 視圖部分 219
14.3.1 v—link 219
14.3.2 router—view 222
14.4 路由實例 222
14.5 組件路由配置 227
14.5.1 路由切換的各個階段 227
14.5.2 各階段的鉤子函數介紹 230
14.6 路由匹配 236
14.6.1 動態片段 236
14.6.2 全匹配片段 237
14.6.3 具名路徑 237
14.6.4 路由對象 238
14.7 transition對象 239
14.8 嵌套路由 239
14.9 動態加載路由組件 241
14.10 實戰 242
14.10.1 瀏覽器直接引用 242
14.10.2 Webpack模塊化開發 244
14.11 常見問題解析 250
第15章 vue—cli 254
15.1 安裝 254
15.2 基本使用 254
15.3 命令 257
15.3.1 init 257
15.3.2 list 257
15.4 模板 258
15.4.1 官方模板 258
15.4.2 自定義模板 258
15.4.3 本地模板 259
15.5 不錯的工具包 259
15.5.1 commander 259
15.5.2 download—git—repo 259
15.5.3 inquirer 259
15.5.4 ora 260
第16章 測試開發與調試 261
16.1 測試工具 261
16.1.1 ESLint 261
16.1.2 工具包 263
16.2 開發工具 264
16.2.1 Vue Syntax Highlight 264
16.2.2 Snippets 264
16.2.3 其他編輯器／IDE 265
16.3 調試工具 269
第17章 Scrat+Vue.js的化學反應 271
17.1 淺談前端工程化 271
17.2 前端工程化怎麼做 271
17.3 Scrat簡介 273
17.4 Scrat+Vue.js實現組件 275
17.5 案例分析 276
17.5.1 准備工作 277
17.5.2 代碼實現 279
17.5.3 編譯和發布 284
17.6 總結 287
第18章 Vue.js 2.0288
18.1 API變更 288
18.1.1 全局配置 288
18.1.2 全局API 289
18.1.3 VM選項 290
18.1.4 實例屬性 294
18.1.5 實例方法 294
18.1.6 指令 296
18.1.7 特殊元素 297
18.1.8 服務端渲染 297
18.2 Virtual DOM 297
18.2.1 認識Virtual DOM 297
18.2.2 Virtual DOM在Vue.js 2.0中的實現 299
18.3 服務端渲染技術 315
18.3.1 普通服務端渲染 315
18.3.2 流式服務端渲染 320
18.4 總結 326
第19章 源碼篇——util 327
19.1 env 327
19.1.1 系統判斷 328
19.1.2 屬性支持 328
19.1.3 過渡屬性 329
19.1.4 nextTick 330
19.1.5 set 332
19.2 dom 332
19.2.1 dom操作 333
19.2.2 屬性操作 339
19.2.3 class操作 341
19.2.4 事件操作 343
19.2.5 其他 344
19.3 lang 347
19.3.1 對象操作 347
19.3.2 名稱轉換 351
19.3.3 數組操作 352
19.3.4 類型轉換 352
19.3.5 方法綁定 354
19.3.6 其他 354
19.4 components 357
19.5 options 359
19.6 debug 364
第20章 源碼篇——深入響應式原理 365
20.1 如何追蹤變化 365
20.1.1 Observer 367
20.1.2 Directive 372
20.1.3 Watcher 382
20.2 變化檢測問題 391
20.3 初始化數據 394
20.4 異步更新隊列 395
20.5 計算屬性的奧秘 398
20.6 總結 402
第21章 源碼篇——父子類合並策略 403
21.1 策略是什麼 403
21.1.1 生命周期合並策略 403
21.1.2 屬性方法計算 405
21.1.3 數據合並策略 406
第22章 源碼篇——緩存 409
22.1 Cache有什麼用 409
22.2 LRU 410
22.3 Cache類 410
22.4 put 410
22.5 shift 411
22.6 get 412
第23章 源碼篇——屬性props 413
23.1 流程設計 413
23.2 屬性name 415
23.3 coerce 416
23.4 type 驗證 416
23.5 default 417
23.6 validator 418
第24章 源碼篇——events 419
24.1 events配置是什麼 419
24.2 如何配置 419
24.2.1 ＄emit觸發 422
24.2.2 ＄once 綁定 424
24.2.3 ＄off刪除 425
24.2.4 ＄dispatch派發 426
24.2.5 ＄broadcast廣播 427
第25章 Webpack 428
25.1 安裝 428
25.2 基本使用 429
25.3 命令行 430
25.4 配置文件 430
25.4.1 context 431
25.4.2 entry 431
25.4.3 output 432
25.4.4 module 433
25.4.5 resolve 434
25.4.6 devServer 435
25.5 開發調試 435
25.5.1 安裝 435
25.5.2 啟動服務 435
25.5.3 命令行參數 436
25.5.4 配置文件 436
25.6 使用插件 436
25.6.1 安裝 437
25.6.2 常用插件 438
第26章 Rollup 440
26.1 簡介 440
26.2 安裝 441
26.3 配置 441
26.4 命令 443
26.5 插件 447
26.6 常見問題解析 449
第27章 Browserify 450
27.1 安裝 450
27.2 基本使用 450
27.3 轉換模塊 451
27.3.1 安裝轉換模塊 451
27.3.2 使用轉換模塊 452
27.3.3 相關轉換模塊介紹 452
第28章 vue—loader 456
28.1 如何配置 456
28.2 包含內容 456
28.3 特性介紹 457
28.4 常見問題解析 458
28.5 源碼解析 459
28.6 工具包介紹 465
第29章 PostCSS 467
29.1 安裝 467
29.2 配置 467
29.3 命令 468
29.4 插件 471
第30章 拓展篇 473
30.1 Composition Event 473
30.2 ES 6474
30.2.1 模塊 475
30.2.2 let 479
30.2.3 const 481
30.3 object 482
30.4 函數柯里化 488
30.4.1 動態創建函數 488
30.4.2 參數復用 48