第1章Vue 3簡介 1.1Web前端框架 1.1.1前端框架的誕生 1.1.2MVC模式 1.1.3從MVC模式到MVVM模式 1.2認識Vue 3 1.2.1什么是Vue 3 1.2.2Vue 3的優勢 1.3選擇IDE 1.4配置Node.js環境 1.5安裝Vue 3 1.5.1獨立版本安裝 1.5.2CDN方式安裝 1.5.3npm方式安裝 1.5.4使用前端腳手架安裝 1.6熟悉vuedevtools調試工具 1.7本章小結 第2章Hello World與Vue 3的基礎特性 2.1Hello World示例 2.1.1Vue 3應用的核心對象 2.1.2Vue 3的組件結構 2.2Vue 3組件的生命周期 2.2.1認識生命周期 2.2.2鉤子函數 2.3數據綁定 2.3.1文本插值 2.3.2插入原始HTML 2.3.3使用JavaScript表達式 2.4案例 2.4.1利用表單實現簡單登錄頁面 2.4.2利用過濾器過濾指定字符 2.5本章小結 習題 第3章Vue 3基本指令 3.1條件渲染指令 3.1.1vif、velseif、velse 3.1.2vshow 3.1.3vshow與vif的選擇 3.2列表渲染指令vfor 3.2.1基本用法 3.2.2數組更新 3.2.3vfor的其他操作 3.3數據綁定指令vbind 3.3.1參數與屬性綁定 3.3.2動態綁定 3.3.3vbind的縮寫及合并行為 3.4vmodel與表單 3.4.1基本用法 3.4.2值綁定 3.4.3修飾符 3.5方法、計算屬性與監聽屬性 3.5.1Vue 3中的方法 3.5.2計算屬性 3.5.3監聽屬性 3.5.4方法、計算屬性與監聽屬性的區別 3.6事件處理 3.6.1監聽事件von 3.6.2事件處理函數 3.6.3內聯處理函數 3.6.4多事件監聽 3.6.5事件修飾符 3.6.6按鍵修飾符 3.6.7系統修飾鍵 3.7其他基本指令 3.7.1首次渲染vonce 3.7.2使用vcloak避免渲染時閃爍 3.8自定義指令 3.8.1注冊自定義指令 3.8.2鉤子函數 3.8.3動態指令參數 3.8.4函數簡寫與對象字面量 3.9案例 3.9.1使用自定義指令實現隨機背景色 3.9.2注冊登錄頁面信息 3.10本章小節 習題 第4章組件應用 4.1組件的基礎概念 4.1.1基本使用方法 4.1.2組件復用 4.1.3組織結構 4.1.4鉤子函數 4.2組件間數據傳遞 4.2.1通過props屬性傳遞數據 4.2.2通過總線傳遞數據 4.2.3通過監聽事件傳遞數據 4.3內容分發 4.3.1基本使用方法 4.3.2編譯作用域 4.3.3后備內容 4.3.4具名插槽 4.3.5作用域插槽 4.3.6動態插槽名 4.4其他應用 4.4.1動態組件 4.4.2異步組件 4.5案例 4.5.1實現日歷組件 4.5.2利用組件實現“彈出層” 4.6本章小結 習題 第5章樣式綁定 5.1綁定HTML樣式 5.1.1對象控制樣式 5.1.2數組控制樣式 5.1.3在組件中的應用 5.2綁定內聯樣式 5.2.1對象描述樣式 5.2.2數組描述樣式 5.2.3自動添加前綴 5.2.4多重值樣式 5.3實例： 實現列表的奇偶行不同樣式 5.4本章小結 習題 第6章組件復用 6.1DOM渲染函數實現復用 6.1.1DOM基礎 6.1.2JavaScript動態生成DOM對象 6.1.3引入JSX語法 6.1.4函數式組件 6.1.5模版編譯 6.2混入對象 6.2.1選項合并復用 6.2.2全局混入復用 6.2.3自定義選項合并策略 6.3插件復用 6.3.1編寫插件 6.3.2使用插件 6.4案例： 使用渲染函數渲染列表 6.5本章小結 習題 第7章Vue路由 7.1路由基礎 7.1.1什么是Vue Router 7.1.2在HTML中使用Vue Router 7.1.3在JavaScript代碼中使用Vue Router 7.2動態路由 7.2.1參數響應 7.2.2捕獲所有路由 7.2.3高級匹配模式和匹配優先級 7.3路由進階使用 7.3.1嵌套路由 7.3.2編程式導航 7.3.3命名路由 7.3.4命名視圖 7.3.5重定向與別名 7.3.6路由組件參數傳遞 7.4history模式 7.4.1HTML 5 History API 7.4.2后端配置 7.5導航守衛 7.5.1全局守衛 7.5.2路由獨享守衛 7.5.3組件內守衛 7.5.4導航解析流程 7.6路由元信息 7.7過渡動效 7.7.1單路由過渡 7.7.2路由動態過渡 7.8數據獲取 7.9路由懶加載 7.10滾動行為 7.11本章小結 習題 第8章axios異步請求 8.1axios基礎 8.1.1axios簡介 8.1.2安裝axios 8.1.3基本使用方法 8.2API介紹 8.3適配網絡請求 8.4攔截器介紹 8.5本章小結 習題 第9章Vue CLI部署項目 9.1Vue CLI的簡介 9.1.1什么是Vue CLI 9.1.2安裝Vue CLI 9.1.3創建Hello World項目 9.1.4了解Vue CLI項目結構
9.2webpack概述 9.2.1了解webpack 9.2.2配置webpack 9.3構建與部署Vue CLI項目 9.4本章小結 習題 第10章Vuex組件狀態管理 10.1Vuex介紹 10.1.1Vuex是什么 10.1.2Vuex特點 10.2Vuex安裝 10.2.1通過npm或yarn安裝 10.2.2獨立構建 10.3Vuex狀態管理 10.3.1組件中獲取Vuex狀態 10.3.2輔助函數mapState() 10.3.3對象展開運算符 10.4Vuex狀態獲取方法 10.4.1屬性訪問 10.4.2函數訪問 10.4.3輔助函數mapGetters() 10.5Vuex狀態同步更改方法 10.5.1通過提交mutation更改Vuex狀態 10.5.2提交載荷 10.5.3對象風格提交方式 10.6Vuex狀態異步更改方法 10.6.1分發action 10.6.2在組件中分發action 10.6.3組合action 10.7Vuex狀態模塊化管理 10.7.1模塊局部狀態 10.7.2模塊命名空間 10.7.3模塊動態注冊 10.7.4模塊重用 10.8本章小結 習題 第11章紅色旅游App綜合項目 11.1紅色旅游App總體規劃 11.2腳手架及項目搭建 11.3第三方依賴的安裝 11.3.1安裝axios 11.3.2安裝Element Plus 11.4首頁功能開發 11.4.1構建統一頭部 11.4.2設計全局菜單 11.4.3廣告輪播組件 11.4.4實現推薦內容列表 11.4.5首頁組件 11.4.6底部導航組件 11.5產品列表頁功能開發 11.6搜索頁面功能開發 11.6.1搜索框組件 11.6.2瀑布流組件改造 11.7產品詳情頁功能開發 11.7.1產品詳情組件 11.7.2用戶評價組件 11.8購物車頁面開發 11.9個人中心頁面的實現 11.10路由配置 11.11項目調試 11.12本章小結 第12章Vue 3項目部署 12.1構建發布版本 12.2部署 12.3本章小結