《循序漸進Vue.js 3.x前端開發實戰》是2023年8月1日清華大學出版社出版的圖書,作者:張益琿、曹艷琴。
基本介紹
- 中文名:循序漸進Vue.js 3.x前端開發實戰
- 作者:張益琿、曹艷琴
- 出版時間:2023年8月1日
- 出版社:清華大學出版社
- ISBN:9787302641216
- 定價:98 元
- 印次:1-2
- 印刷日期:2023.09.26
內容簡介,圖書目錄,
內容簡介
《循序漸進Vue.js 3.x前端開發實戰》以一個多年前端“老司機”的視角,循序漸進地介紹流行前端框架Vue.js 3.x全家桶與周邊工具在商業項目開發中的套用。全書共15章,第1~6章介紹Vue.js 3的模板、組件、互動處理等基礎知識;第7章介紹Vue.js 3框架的回響式編程及組合式API;第8章介紹使用Vue.js 3框架開發前端動畫效果;第9章介紹開發大型項目必備的腳手架工具Vue CLI和Vite;第10章介紹基於Vue.js 3的UI組件庫Element Plus;第11~13章分別介紹網路請求框架vue-axios、路由管理框架Vue Router、狀態管理框架Vuex;第14章和第15章介紹兩個項目的開發棗學習筆記網站和電商後台管理系統。同時,還精心設計了實踐和練習,錄製了45集教學視頻,提供了完整原始碼。
《循序漸進Vue.js 3.x前端開發實戰》通俗易懂,範例豐富,原理與實踐並重,適合Vue.js初學者和前端開發人員使用,也可以作為網課、培訓機構與大中專院校的教學用書。
圖書目錄
目 錄
第1章 從前端基礎到Vue.js 31
1.1 前端技術演進1
1.2 HTML入門2
1.2.1 準備開發工具3
1.2.2 HTML中的基礎標籤5
1.3 CSS入門7
1.3.1 CSS選擇器入門8
1.3.2 CSS樣式入門10
1.4 JavaScript入門13
1.4.1 為什麼需要JavaScript13
1.4.2 JavaScript語法簡介15
1.5 漸進式開發框架Vue17
1.5.1 第一個Vue套用17
1.5.2 範例演練:實現一個簡單的用戶登錄頁面19
1.5.3 Vue 3的新特性21
1.5.4 為什麼要使用Vue框架22
1.6 小結與練習23
第2章 Vue模板套用24
2.1 模板基礎24
2.1.1 模板插值25
2.1.2 模板指令28
2.2 條件渲染29
2.2.1 使用v-if指令進行條件渲染30
2.2.2 使用v-show指令進行條件渲染32
2.3 循環渲染33
2.3.1 v-for指令的使用方法33
2.3.2 v-for指令的高級用法36
2.4 範例演練:實現待辦任務列表套用38
2.4.1 步驟一:使用HTML搭建套用框架結構38
2.4.2 步驟二:實現待辦任務列表的邏輯開發39
2.5 小結與練習40
第3章 Vue組件的屬性和方法41
3.1 屬性與方法基礎41
3.1.1 屬性基礎42
3.1.2 方法基礎42
3.2 計算屬性和偵聽器43
3.2.1 計算屬性43
3.2.2 使用計算屬性還是函式44
3.2.3 計算屬性的賦值45
3.2.4 屬性偵聽器46
3.3 進行函式限流48
3.3.1 手動實現一個簡易的限流函式48
3.3.2 使用Lodash庫進行函式限流50
3.4 表單數據的雙向綁定50
3.4.1 文本輸入框50
3.4.2 多行文本輸入區域51
3.4.3 複選框與單選框52
3.4.4 選擇列表53
3.4.5 兩個常用的修飾符53
3.5 樣式綁定54
3.5.1 為HTML標籤綁定class屬性54
3.5.2 綁定內聯樣式56
3.6 範例演練:實現一個功能完整的用戶註冊頁面57
3.6.1 步驟一:搭建用戶註冊頁面57
3.6.2 步驟二:實現註冊頁面的用戶互動60
3.7 小結與練習62
第4章 處理用戶互動63
4.1 事件的監聽與處理63
4.1.1 事件監聽示例63
4.1.2 多事件處理65
4.1.3 事件修飾符66
4.2 Vue中的事件類型68
4.2.1 常用事件類型68
4.2.2 按鍵修飾符70
4.3 範例演練:隨滑鼠移動的小球72
4.4 範例演練:彈球遊戲74
4.5 小結與練習77
第5章 組件基礎79
5.1 Vue套用與組件79
5.1.1 Vue套用的數據配置選項79
5.1.2 定義組件81
5.2 組件中數據與事件的傳遞82
5.2.1 為組件添加外部屬性83
5.2.2 處理組件事件84
5.2.3 在組件上使用v-model指令85
5.3 自定義組件的插槽88
5.3.1 組件插槽的基本用法88
5.3.2 多具名插槽的用法90
5.4 動態組件的簡單套用91
5.5 範例演練:開發一款小巧的開關按鈕組件93
5.6 小結與練習95
第6章 組件進階97
6.1 組件的生命周期與高級配置97
6.1.1 生命周期方法98
6.1.2 套用的全局配置選項101
6.1.3 組件的註冊方式102
6.2 組件props屬性的高級用法103
6.2.1 對props屬性進行驗證103
6.2.2 props的唯讀性質106
6.2.3 組件數據注入107
6.3 組件Mixin技術110
6.3.1 使用Mixin來定義組件110
6.3.2 Mixin選項的合併112
6.3.3 進行全局Mixin113
6.4 使用自定義指令114
6.4.1 認識自定義指令114
6.4.2 自定義指令的參數115
6.5 組件的Teleport功能116
6.6 小結與練習118
第7章 Vue回響式編程119
7.1 回響式編程的原理與在Vue中的套用119
7.1.1 手動追蹤變數的變化119
7.1.2 Vue中的回響式對象122
7.1.3 獨立的回響式值Ref的套用124
7.2 回響式的計算與監聽126
7.2.1 關於計算變數126
7.2.2 監聽回響式變數128
7.3 組合式API的套用130
7.3.1 關於setup方法130
7.3.2 在setup方法中定義生命周期行為132
7.4 範例演練:實現支持搜尋和篩選的用戶列表133
7.4.1 常規風格的示例工程開發133
7.4.2 使用組合式API重構用戶列表頁面136
7.5 小結與練習139
第8章 動畫140
8.1 使用CSS3創建動畫140
8.1.1 transition過渡動畫140
8.1.2 keyframes動畫142
8.2 使用JavaScript的方式實現動畫效果144
8.3 Vue過渡動畫145
8.3.1 定義過渡動畫145
8.3.2 設定動畫過程中的監聽回調149
8.3.3 多個組件的過渡動畫150
8.3.4 列表過渡動畫152
8.4 範例演練:最佳化用戶列表頁面154
8.5 小結與練習155
第9章 Vue CLI工具的使用156
9.1 Vue CLI工具入門156
9.1.1 Vue CLI工具的安裝156
9.1.2 快速創建項目158
9.2 Vue CLI項目模板工程160
9.2.1 模板工程的目錄結構160
9.2.2 運行Vue項目工程164
9.3 在項目中使用依賴165
9.4 工程構建167
9.5 新一代前端構建工具Vite168
9.5.1 Vite與Vue CLI168
9.5.2 體驗Vite構建工具169
9.6 小結與練習170
第10章 Element Plus 基於Vue 3的UI組件庫171
10.1 Element Plus入門171
10.1.1 Element Plus的安裝與使用172
10.1.2 按鈕組件174
10.1.3 標籤組件177
10.1.4 空態圖與載入占點陣圖組件179
10.1.5 圖片與頭像組件183
10.2 表單類組件184
10.2.1 單選框與多選框184
10.2.2 標準輸入框組件186
10.2.3 帶推薦列表的輸入框組件188
10.2.4 數字輸入框190
10.2.5 選擇列表191
10.2.6 多級列表組件194
10.3 開關與滑塊組件196
10.3.1 開關組件196
10.3.2 滑塊組件197
10.4 選擇器組件199
10.4.1 時間選擇器199
10.4.2 日期選擇器201
10.4.3 顏色選擇器202
10.5 提示類組件203
10.5.1 警告組件203
10.5.2 訊息提示204
10.5.3 通知組件205
10.6 數據承載相關組件206
10.6.1 表格組件206
10.6.2 導航選單組件209
10.6.3 標籤頁組件211
10.6.4 抽屜組件212
10.6.5 布局容器組件213
10.7 實戰:教務系統學生表214
10.8 小結與練習218
第11章 基於Vue的網路框架vue-axios的套用219
11.1 使用vue-axios請求天氣數據219
11.1.1 使用網際網路上免費的數據服務219
11.1.2 使用vue-axios進行數據請求221
11.2 vue-axios實用功能介紹224
11.2.1 通過配置的方式進行數據請求224
11.2.2 請求的配置與回響數據結構225
11.2.3 攔截器的使用226
11.3 範例演練:天氣預報套用227
11.3.1 搭建頁面框架227
11.3.2 實現天氣預報套用的核心邏輯230
11.4 小結與練習231
第12章 Vue路由管理232
12.1 Vue Router的安裝與簡單使用232
12.1.1 Vue Router的安裝233
12.1.2 一個簡單的Vue Router的使用示例233
12.2 帶參數的動態路由235
12.2.1 路由參數匹配235
12.2.2 路由匹配的語法規則237
12.2.3 路由的嵌套239
12.3 頁面導航240
12.3.1 使用路由方法240
12.3.2 導航歷史控制242
12.4 關於路由的命名242
12.4.1 使用名稱進行路由切換243
12.4.2 路由視圖命名243
12.4.3 使用別名244
12.4.4 路由重定向245
12.5 關於路由傳參246
12.6 路由導航守衛247
12.6.1 定義全局的導航守衛247
12.6.2 為特定的路由註冊導航守衛248
12.7 動態路由250
12.8 小結與練習252
第13章 Vue狀態管理253
13.1 認識Vuex框架253
13.1.1 關於狀態管理253
13.1.2 安裝與體驗Vuex255
13.2 Vuex中的一些核心概念258
13.2.1 Vuex中的狀態state258
13.2.2 Vuex中的Getter方法259
13.2.3 Vuex中的Mutation261
13.2.4 Vuex中的Action262
13.2.5 Vuex中的Module263
13.3 小結與練習266
第14章 實戰項目:開發一個學習筆記網站267
14.1 網站框架的搭建267
14.2 配置專題與文章目錄272
14.3 渲染文章筆記內容275
14.4 小結與練習279
第15章 實戰項目:電商後台管理系統實戰280
15.1 用戶登錄模組開發280
15.1.1 項目搭建280
15.1.2 用戶登錄頁面開發283
15.2 項目主頁搭建286
15.2.1 主頁框架搭建286
15.2.2 完善註銷功能289
15.3 訂單管理模組開發290
15.3.1 使用Mock.js進行模擬數據的生成290
15.3.2 編寫工具類與全局樣式291
15.3.3 完善訂單管理頁面292
15.4 商品管理模組的開發298
15.4.1 商品管理列表頁的開發298
15.4.2 新增商品之基礎配置303
15.4.3 新增商品之價格和庫存配置306
15.4.4 新增商品之詳情設定309
15.4.5 添加商品分類311
15.5 店長管理模組的開發313
15.5.1 店長列表開發313
15.5.2 店長審批列表與店長訂單316
15.6 財務管理與數據統計功能模組開發317
15.6.1 交易明細與財務對賬單318
15.6.2 數據統計模組開發319
15.7 小結與練習323