精通Vue.js：Web前端開發技術詳解（微課視頻版）

購買商店

---

精通Vue.js：Web前端開發技術詳解（微課視頻版）

$714.00

馬上購買

---

內容描述

---

本書循序漸進地介紹了Vue框架的用法，主要內容包括前後端分離的基本原理、MVVM設計模式、Vue的基本用法、內置指令、自定義指令、計算屬性和數據監聽、綁定表單、綁定CSS樣式、CSS過渡和動畫、Vue組件的開發、Vue CLI腳手架工具、路由管理器、組合API、Axios和狀態管理等。
本書內容通俗易懂，案例豐富，理論和實踐緊密結合。本書的範例採用Vue 3，最後一章提供了一個整合前端與後端的綜合案例，幫助讀者迅速掌握開發實用Web應用的技巧。
本書適合所有前端Web開發人員閱讀，無論是初學者還是已經有開發經驗的從業人員，都能從本書中受益。另外，本書也適合作為相關培訓機構的教材。

目錄大綱

---

目錄

源代碼

第1章Vue簡介

1．1MVVM設計模式

1．2Vue框架的特點

1．3第一個Vue範例

1．3．1把模型數據綁定到視圖

1．3．2把視圖上的輸入數據與模型綁定

1．3．3改變模型數據對視圖的影響

1．4Vue組件的選項

1．4．1data選項

1．4．2template選項

1．4．3methods選項

1．5Vue組件實例的生命周期

1．6Vue編譯模板和渲染DOM的基本原理

1．6．1編譯模板

1．6．2渲染DOM

1．7異步渲染DOM

1．8防抖動函數debounce()

1．9Vue的開發和調試工具

1．9．1NPM

1．9．2vuedevtools調試工具

1．10小結

1．11思考題

第2章Vue指令

2．1內置Vue指令

2．1．1vbind指令

2．1．2vmodel指令

2．1．3vshow指令

2．1．4vif/velseif/velse指令

2．1．5vfor指令

2．1．6von指令

2．1．7von指令的事件修飾符

2．1．8vtext指令

2．1．9vhtml指令

2．1．10vpre指令

2．1．11vonce指令

2．1．12vcloak指令

2．2自定義Vue指令

2．2．1註冊自定義指令

2．2．2自定義指令的鉤子函數

2．2．3自定義指令的動態參數和動態值

2．2．4把對象字面量賦值給自定義指令

2．2．5鉤子函數簡寫

2．2．6自定義指令範例： vimg指令

2．2．7自定義指令範例： vdrag指令

2．2．8自定義指令範例： vclickoutside指令

2．3小結

2．4思考題

第3章計算屬性和數據監聽

3．1計算屬性

3．1．1讀寫計算屬性

3．1．2比較計算屬性和方法

3．1．3用計算屬性過濾數組

3．1．4計算屬性實用範例：實現購物車

3．2數據監聽

3．2．1用Web Worker執行數據監聽中的異步操作

3．2．2在watch選項中調用方法

3．2．3比較同步操作和異步操作

3．2．4深度監聽

3．2．5立即監聽

3．2．6比較計算屬性和數據監聽watch選項

3．3Vue的響應式系統的基本原理

3．4小結

3．5思考題

第4章綁定表單

4．1綁定文本域

4．2綁定單選按鈕

4．3綁定復選框

4．4下拉列表

4．5把對象與表單綁定

4．6小結

4．7思考題

第5章綁定CSS樣式

5．1綁定class屬性

5．1．1綁定對象類型的變量

5．1．2綁定計算屬性

5．1．3綁定數組

5．1．4為Vue組件綁定CSS樣式

5．2綁定style屬性

5．2．1綁定對象類型的變量

5．2．2綁定數組

5．2．3與瀏覽器兼容

5．3範例： 變換表格奇偶行的樣式

5．4小結

5．5思考題

第6章CSS過渡和動畫

6．1CSS過渡

6．1．1為組件設定名字

6．1．2為組件顯式指定過渡樣式類型

6．1．3使用鉤子函數和Velocity函數庫

6．1．4設置初始過渡效果

6．1．5切換過渡的DOM元素

6．1．6過渡模式

6．1．7切換過渡的組件

6．2CSS動畫

6．2．1使用第三方的CSS動畫樣式類型庫

6．2．2使用鉤子函數和Velocity函數庫

6．3過渡組合組件<transitiongroup>

6．4動態控制過渡和動畫

6．5小結

6．6思考題

第7章Vue組件開發基礎

7．1註冊全局組件和局部組件

7．1．1註冊全局組件

7．1．2註冊局部組件

7．2組件的命名規則

7．3向組件傳遞屬性

7．3．1傳遞動態值

7．3．2對象類型的屬性

7．3．3數組類型的屬性

7．3．4綁定靜態數據

7．3．5傳遞對象

7．3．6屬性的不可改變性

7．3．7單向數據流

7．3．8屬性驗證

7．4nonprop屬性

7．4．1單節點模板中根節點對nonprop屬性的繼承

7．4．2在單節點模板中禁止nonprop屬性的繼承

7．4．3多節點模板中節點與nonprop屬性的綁定

7．5組件樹

7．6監聽子組件的事件

7．6．1驗證事件

7．6．2通過vmodel指令綁定屬性

7．6．3通過vmodel指令綁定多個屬性

7．6．4vmodel指令的自定義修飾符

7．6．5處理子組件中DOM元素的原生事件

7．7綜合範例： 自定義組件

7．8小結

7．9思考題

第8章Vue組件開發高級技術

8．1插槽

8．1．1組件的渲染作用域

8．1．2組件的默認內容

8．1．3為組件命名 

8．1．4組件的動態名字

8．1．5組件的自定義屬性

8．2動態組件

8．3異步組件

8．3．1異步組件的選項

8．3．2局部異步組件

8．4組件的生命周期

8．5組件的混入塊

8．5．1合並規則

8．5．2全局混入塊

8．5．3自定義合並策略

8．5．4使用混入塊的註意事項

8．6組件之間的互相訪問

8．6．1訪問根組件

8．6．2訪問父組件

8．6．3訪問子組件

8．6．4依賴註入

8．7組件的遞歸

8．8定義組件模板的其他方式

8．9組件與DOM元素的通信

8．9．1在組件中包裹子組件 

8．9．2多個組件與同一個DOM元素通信

8．10小結

8．11思考題

第9章render()函數和虛擬DOM

9．1render()函數

9．2真實DOM

9．3虛擬DOM

9．4h()函數的用法

9．4．1虛擬DOM中虛擬節點的唯一性

9．4．2h()函數的完整範例

9．4．3創建組件的虛擬節點

9．5用render()函數實現模板的一些功能

9．5．1實現vif和vfor指令的流程控制功能

9．5．2實現vmodel指令的數據綁定功能

9．5．3實現von指令的監聽事件功能

9．5．4實現事件修飾符和按鍵修飾符的功能

9．5．5實現插槽功能

9．5．6生成動態組件的節點

9．5．7自定義指令

9．6在render()函數中使用JSX語法

9．7綜合範例： 博客帖子列表

9．8小結

9．9思考題

第10章Vue CLI腳手架工具

10．1Vue CLI簡介以及安裝

10．2創建Vue項目 

10．2．1vue create命令的用法

10．2．2刪除預配置

10．2．3vue ui命令的用法

10．3Vue項目的結構

10．3．1單文件組件

10．3．2程序入口main．js文件

10．3．3項目的index．html文件和SPA單頁應用

10．3．4運行項目

10．4安裝和配置Visual Studio Code

10．4．1安裝Vetur和ESLint插件

10．4．2在VSCode中打開helloworld項目

10．4．3在VSCode中運行helloworld項目

10．5創建單文件組件

10．5．1創建Hello．vue文件

10．5．2修改App．vue文件

10．5．3運行修改後的helloworld項目

10．6創建正式產品

10．7在Tomcat中發布正式產品

10．7．1安裝Tomcat

10．7．2把helloworld正式產品發布到Tomcat中

10．8小結

10．9思考題

第11章Vue Router路由管理器

11．1簡單的路由管理

11．2路由管理器的基本用法

11．3在Vue項目中使用路由管理器

11．3．1創建Home．vue和About．vue組件文件

11．3．2在組件中加入圖片

11．3．3在index．js中創建路由管理器實例

11．3．4在main．js中使用路由管理器

11．3．5在App．vue中加入<routerlink>組件和<routerview>組件

11．3．6運行helloworld項目

11．4路由模式

11．5動態鏈接

11．5．1鏈接中包含路徑參數

11．5．2鏈接中包含查詢參數

11．5．3鏈接與通配符匹配

11．6嵌套的路由

11．6．1創建Items父組件的文件Items．vue

11．6．2創建Item子組件的文件Item．vue

11．6．3在index．js中設置父組件和子組件的路由

11．6．4在根組件的模板中加入Items父組件的導航鏈接

11．7命名路由

11．7．1重定向

11．7．2使用別名

11．8命名視圖

11．9向路由的組件傳遞屬性

11．9．1向命名視圖的組件傳遞屬性

11．9．2通過函數傳遞屬性

11．10編程式導航

11．11導航守衛函數

11．11．1全局導航守衛函數

11．11．2驗證用戶是否登錄

11．11．3設置受保護資源

11．11．4在單頁面應用中設置目標路由的頁面標題

11．11．5特定路由的導航守衛函數

11．11．6組件內的導航守衛函數

11．12數據抓取

11．12．1導航後抓取

11．12．2導航前抓取

11．13設置頁面的滾動行為

11．13．1scrollBehavior()函數的返回值

11．13．2延遲滾動

11．14延遲加載路由

11．14．1把多個組件打包到同一個文件中

11．14．2在路由的組件中嵌套異步組件

11．15動態路由

11．16小結

11．17思考題

第12章組合API

12．1setup()函數的用法

12．1．1props參數

12．1．2context參數

12．1．3ref()函數

12．1．4reactive()函數

12．1．5toRefs()函數

12．1．6readonly()函數

12．1．7定義計算屬性

12．1．8註冊組件的生命周期鉤子函數

12．1．9通過watch()函數監聽數據

12．1．10通過watchEffect()函數監聽數據

12．1．11獲取模板中DOM元素的引用

12．1．12依賴註入(provide/inject)

12．2分割setup()函數

12．2．1把setup()函數分割到多個函數中 

12．2．2把setup()函數分割到多個文件中

12．3小結

12．4思考題

第13章通過Axios訪問服務器

13．1Axios的基本用法

13．1．1同域訪問和跨域訪問

13．1．2獲取響應結果

13．1．3處理錯誤

13．2在Vue項目中使用Axios

13．2．1異步請求

13．2．2POST請求方式

13．2．3對象和查詢字符串的轉換

13．2．4下載圖片 

13．2．5上傳文件

13．2．6設置反向代理服務器

13．3Axios API的用法

13．4請求配置

13．4．1創建axios實例

13．4．2設定默認的請求配置

13．4．3請求配置的優先順序

13．4．4取消請求的令牌

13．5並發請求

13．6請求攔截器和響應攔截器

13．7前端與後端的會話

13．7．1通過Cookie跟蹤會話

13．7．2通過token令牌跟蹤會話

13．8前端與後端代碼的整合

13．9小結

13．10思考題

第14章通過Vuex進行狀態管理

14．1Vuex的基本工作原理

14．2Vuex的基本用法

14．3在Vue項目中使用Vuex

14．3．1strict嚴格模式

14．3．2通過計算屬性訪問狀態

14．3．3狀態映射函數： mapState()

14．3．4更新荷載

14．3．5更新映射函數： mapMutations()

14．3．6把更新函數的名字設為常量

14．3．7更新函數只能包含同步操作

14．4倉庫的getters選項

14．4．1getters映射函數： mapGetters()

14．4．2為getters選項的屬性設置參數

14．5倉庫的actions選項

14．5．1傳入更新荷載

14．5．2動作映射函數： mapActions()

14．6異步動作

14．6．1異步動作範例

14．6．2使用async/await的範例

14．7表單處理

14．7．1在處理input事件的方法中提交更新函數

14．7．2可讀寫的計算屬性

14．8倉庫的模塊化

14．8．1模塊的局部狀態

14．8．2訪問根狀態

14．8．3命名空間

14．9通過Composition API訪問倉庫

14．10狀態的持久化

14．11小結

14．12思考題

第15章創建綜合購物網站應用

15．1前端組件的結構

15．2前端開發技巧

15．2．1狀態管理

15．2．2狀態同步

15．2．3運用Composition API提高代碼可重用性

15．2．4在組件中顯示圖片

15．2．5路由管理

15．2．6每個組件的頁面標題

15．2．7用戶登錄流程

15．2．8受保護的資源

15．2．9異步處理Axios的請求

15．2．10單獨運行前端項目

15．3後端架構

15．3．1實現業務數據

15．3．2實現業務邏輯服務層

15．3．3實現DAO層

15．3．4實現控制器層

15．3．5前端與後端的數據交換

15．4發布和運行netstore應用

15．4．1安裝SAMPLEDB數據庫

15．4．2發布後端netstore項目

15．4．3調試和運行前端netstore項目

15．4．4創建並發布前端項目的正式產品

15．4．5運行netstore應用

15．5小結

附錄A思考題答案

---