Vue.js框架與Web前端開發從入門到精通

舒志，從事IT行業12年，著名地圖前端設計、Flash AS2/AS3腳本腳本、前端佈局開發（JavaScript原生或Vue.js框架）、大數據可視化開發（ECharts）、GIS開發（百度）、Java後台接口接口 開發（SSM框架）、整個項目策劃與交付。
曾先後為浙江大學知識產權研究所（現名浙江大學控制科學與工程學院工業控制研究所）、杭州華數傳媒電視、銀江設計；項目與中興創軟設計多個合作項目；獨立設計完善了 杭州科技城夢想智慧旅遊項目、貴州安順黃果樹二期（關嶺縣智能旅遊系統）；完成榮盛房地產發展股份有限公司前台和後台的前端開發工作。當前創業未來於中軟國際有限公司高級前端 開發工程師。

第 1 章 Vu​​e.js 概述
1.1 Vue.js簡介2
1.2 Vue.js與其他前端框架的對比4
1.3 深入理解自閉症 9
1.4 Vue.js 的優勢 12
1.5 小結 13

第2章開始Vue.js之旅
2.1 安裝Vue.js開發環境 16
2.1.1 Node.js環境安裝16
2.1.2 npm安裝及參數設置 23
2.1.3 用腳手架生成項目目錄 28
2.1.4 自定義Vue.js模板項目文件 31
2.1.5 使用vue-cli3圖形界面 34
2.1.6 下載、安裝、設置VSCode編輯器 44
2. 安裝 VSCode 常用包 46
2.3 在VSCode中開發項目48
2.3.1 在 VSCode 中創建新項目 48
2.3.2 VSCode 導入項目 51
2.3.3 VSCode 更新 54
2.3.4 在VSCode中安裝插件 58
2.3.5 在VSCode中運行Vue.js項目62
2.3.6 用VSCode發布項目64
2.4 小結67
第3章初識Vue.js
3.1 Vue.js項目初始化69
3.1.1創建一個Vue.js實例69
3.1.2 數據綁定與方法使用 70
3.1.3 生命週期鉤子函數 72
3.1.4 生命週期示意圖73
3.2 模板語法 74
3.2.1 向網頁插入文本內容 75
3.2.2 原始 HTML 75
3.2.3 使用 JavaScript 表達式 76
3.2.4 指令參數 76
3.2.5 動態參數 77
3.2.6 閃光符縮寫78
3.2.7 v-bind縮寫78
3.2.8 v-on縮寫78
3.3 計算屬性和偵聽器 79
3.3.1 計算屬性 79
3.3.2 基礎例子 79
3.3.3 計算性能優化 vs 方法 80
3.3.4 計算屬性vs偵聽屬性 81
3.3.5 計算屬性的setter 82
3.3.6偵聽器82
3.4 班級與風格綁定 84
3.4.1 綁定HTML類84
3.4.2 綁定內聯樣式87
3.5 條件警告 88
3.5.1 在元素上使用 v-if 條件描述 89
3.5.2 v-否則 89
3.5.3 v-else-if 89
3.5.4 v-if vs v-show 90
3.5.6 v-if與v-for 90
3.6 列表編譯 90
3.6.1 用v-for把一個數組對應一組標籤 90
3.6.2 在v-for中使用對象 91
3.6.3 維護狀態 92
3.6.4 數組更新檢測 93
3.6.5 對像變更注意事項 94
3.6.6 顯示過濾/排序後的結果 94
3.6.7 在v-for中使用值範圍 95
3.6.8 在上使用 v-for 95
3.6.9 在組件上使用 v-for 95
3.7 事件處理 97
3.7.1 監聽事件98
3.7.2 事件處理方法 98
3.7.3 內聯處理器中的方法99
3.7.4 事件事件符99
3.7.5 附加符101
3.7.6 海綿碼101
3.7.7 系統鍵鍵101
3.7.8 鼠標按鈕符號102
3.7.9 為什麼在HTML中監聽事件103
3.8 表單輸入綁定103
3.8.1 文本 103
3.8.2 多行文本 104
3.8.3 心情104
3.8.4 單選按鈕 104
3.8.5 選擇框105
3.8.6 值綁定106
3.8.7 符號108
3.8.8 在組件上使用v-model 108
3.9 組件基礎108
3.9.1 基本示例 109
3.9.2 組件的109
3.9.3 數據可能有一個函數 109
3.9.4 組件的組織 110
3.9.5 通過prop向子組件傳遞數據111
3.9.6 個別根標籤 112
3.9.7 監聽子組件事件113
3.9.8 使用事件拋出一個值 114
3.9.9 在組件上使用v-model 115
3.9.10 通過商場散播內容 116
3.9.11 動態組件 116
3.9.12 解析DOM模板時的注意事項117
3.10 小結 117

第4章用axios與補充進行數據聯動
4.1 axios概要 119
4.2 axios方法的基本使用120
4.2.1 axios 的安裝 120
4.2.2 axios請求方法及別名（getMethod） 121
4.2.3 axios請求方法及別名（post和put）124
4.2.4 axios請求方法及別名（刪除）130
4.2.5 並發請求 133
4.3 axios方法深入135
4.3.1創建axios實例135
4.3.2 實例的相關配置 136
4.3.3 常用參數配置具體使用方法 138
4.3.4 攔截器 139
4.3.5 錯誤處理 141
4.3.6 取消請求 143
4.4 axios實戰144
4.4.1 項目環境配置144
4.4.2 接口的調試 147
4.4.3 聯繫人列表151
4.4.4 添加、編輯聯繫人 155
4.4.5 保存聯繫人 157
4.4.6 刪除聯繫人162
4.4.7 axios的進一步封裝 164
4.5 小結 168

第5章簡單路由器的使用
5.1 路由器基礎 170
5.1.1 轉發170
5.1.2 動態語音匹配172
5.1.3 語音語音176
5.1.4 編程式的導航179
5.1.5 內部語音180
5.1.6 內部視圖181
5.1.7 生產和別名183
5.2 小結185

第6章生命週期和鉤子函數解析
6.1 beforeCreate鉤子函數187
6.2 創建鉤子函數 187
6.3 裝鉤子函數 188
6.4 更新鉤子函數 188
6.5 beforeDestroy鉤子函數189
6.6 小結189

第7章組件的靈活使用
7.1 組件註冊 191
7.1.1 組件名 191
7.1.2 網絡註冊 vs 局部註冊 192
7.2 道具 193
7.2.1 prop的大小寫193
7.2.2 道具類型 193
7.2.3 瞬間瞬間或動態道具 194
7.2.4 道具驗證 196
7.3 自定義事件197
7.3.1 事件名197
7.3.2 自定義組件的v-model 198
7.4 小結199

第8章Vue.js下的ECharts使用
8.1搭建ECharts開發環境201
8.2 ECharts使用202
8.2.1 餅圖 202
8.2.2 柱狀圖 210
8.2.3 曲線圖 218
8.2.4 散點圖 224
8.2.5雷達圖230
8.2.6 標籤圖 237
8.3 小結240

第9章ElementUI前端前端
9.1 ElementUI 框架概述 242
9.2搭建ElementUI開發環境243
9.3 基礎組件 243
9.4 表單組件 250
9.5 數據顯示組件271
9.6 提示通知類組件 275
9.7 導航菜單類組件 280
9.8 其他組件 284
9.9 小結290

第10章實戰：上市集團門戶網站開發
10.1 插入框架設置292
10.2 業務目錄安排 299
10.3 開發文件配置 300
10.4 公共方法寫304
10.5 公共肖像寫真 306
10.6 頁面效果實現312
10.7 小結 314

第11章實戰：基於Vue.js框架的後台管理系統開發
11.1 插入框架設置 316
11.2 業務目錄安排 320
11.3 開發文件配置 321
11.4 公共方法寫330
11.5 公共肖像寫真 332
11.6 頁面效果實現332
11.7 小結 336