Vue.js前端框架項目實戰(zhàn)(微課版)
定 價:45 元
- 作者:李麗
- 出版時間:2026/1/1
- ISBN:9787121515323
- 出 版 社:電子工業(yè)出版社
- 中圖法分類:TP393.092.2
- 頁碼:188
- 紙張:
- 版次:01
- 開本:16開
本書是以實戰(zhàn)為導向的前端開發(fā)教程,以技術社區(qū)網站項目為依托,系統(tǒng)講解Vue.js框架的核心技術及現代前端工程化實踐,涵蓋從基礎語法到項目部署的全流程技能。全書共六章:第一章奠定前端框架開發(fā)基礎,涵蓋Web前端技術發(fā)展概述、前端開發(fā)工具、Vue.js入門、前端UI框架入門及版本控制與代碼托管;第二章深入基本指令,涵蓋數據綁定及相關指令、條件渲染和列表渲染;第三章聚焦交互特性,解析事件處理、計算屬性與偵聽器;第四章以項目工程化為核心,講解項目初始化、組件化開發(fā)與生命周期;第五章進階到應用架構優(yōu)化,探討路由、組件與狀態(tài)管理;第六章進行聯調與部署實戰(zhàn),完成前后端聯調、項目打包部署等生產級操作。
李麗,女,講師,碩士,主講《前端框架技術與應用》、《二維動畫高級編程》等課程,該課程的課程負責人,承擔教改項目1項,發(fā)表學術論文2篇,獲得軟件著作權7項,指導學生獲得全國職業(yè)院校技能大賽"應用軟件系統(tǒng)開發(fā)”賽項一等獎、浙江省職業(yè)院校技能大賽"應用軟件系統(tǒng)開發(fā)”賽項一等獎、"移動應用開發(fā)”賽項二等獎,全國職業(yè)院校技能大賽"應用軟件系統(tǒng)開發(fā)”賽項一等獎,"中國軟件杯”大學生程序設計大賽全國總決賽二等獎,藍橋杯全國軟件和信息技術專業(yè)人才大賽浙江省賽區(qū)二等獎1個、三等獎4個。
第一章 前端框架開發(fā)基礎 1
1.1 Web前端技術發(fā)展概述 2
1.1.1 前端技術演變 2
1.1.2 前端架構模式 3
1.1.3 單頁面應用 5
習題1.1 6
任務1.1 前端框架技術調研 7
1.2 前端開發(fā)工具 8
1.2.1 VS Code簡介與安裝 8
1.2.2 VS Code界面介紹 8
1.2.3 VS Code常用插件 9
1.2.4 VS Code集成AI代碼工具 10
1.2.5 VS Code常用快捷鍵 14
習題1.2 14
任務1.2 掌握VS Code高效開發(fā)技巧 16
1.3 Vue.js入門 16
1.3.1 Vue.js簡介 16
1.3.2 Vue.js腳本引入 17
1.3.3 Vue.js應用實例創(chuàng)建 18
習題1.3 19
任務1.3 開發(fā)個人主頁 20
1.4 前端UI框架入門 22
1.4.1 Element Plus集成 22
1.4.2 Element Plus組件 24
1.4.3 Element Plus布局 30
習題1.4 36
任務1.4 開發(fā)網站首頁 37
1.5 版本控制與代碼托管 38
1.5.1 版本控制工具Git 39
1.5.2 代碼托管平臺Gitee 39
習題1.5 42
任務1.5 實現代碼托管 42
第二章 基本指令 44
2.1 數據綁定及相關指令 45
2.1.1 雙大括號文本插值 45
2.1.2 v-text指令 46
2.1.3 v-html指令 47
2.1.4 v-bind指令 48
2.1.5 v-model指令 51
習題2.1 55
任務2.1 開發(fā)注冊和登錄頁面 56
2.2 條件渲染 57
2.2.1 v-if指令 58
2.2.2 v-else指令 59
2.2.3 v-else-if指令 60
2.2.4 v-show指令 61
2.2.5 v-if指令與v-show指令 62
習題2.2 63
任務2.2 開發(fā)個人中心頁面 64
2.3 列表渲染 66
2.3.1 v-for指令 66
2.3.2 v-for指令與v-if指令 70
習題2.3 70
任務2.3 開發(fā)列表渲染功能 71
第三章 交互特性 73
3.1 事件處理 74
3.1.1 v-on指令 74
3.1.2 事件修飾符 76
3.1.3 按鍵修飾符 77
3.1.4 系統(tǒng)修飾符 78
習題3.1 79
任務3.1 開發(fā)商城頁面 80
3.2 計算屬性 81
3.2.1 特點和基本用法 81
3.2.2 與方法的比較 84
習題3.2 86
任務3.2 優(yōu)化商城交互功能 87
3.3 偵聽器 87
3.3.1 基本用法 87
3.3.2 深層偵聽器 89
習題3.3 91
任務3.3 集成表單驗證機制 91
第四章 項目工程化 92
4.1 項目初始化 93
4.1.1 包管理工具 93
4.1.2 腳手架 95
4.1.3 項目創(chuàng)建 97
4.1.4 前端UI框架集成 100
習題4.1 101
任務4.1 搭建開發(fā)環(huán)境及創(chuàng)建項目 102
4.2 組件化開發(fā) 102
4.2.1 單文件組件 103
4.2.2 API 104
4.2.3 響應式機制 106
4.2.4 調試工具 109
習題4.2 110
任務4.2 組件化重寫網站 111
4.3 生命周期 114
4.3.1 生命周期鉤子 114
4.3.2 生命周期鉤子的應用 114
習題4.3 117
任務4.3 數據加載與用戶體驗優(yōu)化 118
第五章 應用架構優(yōu)化 119
5.1 路由 120
5.1.1 靜態(tài)路由 120
5.1.2 動態(tài)路由 123
5.1.3 路由傳參 125
5.1.4 嵌套路由 126
5.1.5 編程式導航 128
5.1.6 重定向 131
5.1.7 導航守衛(wèi) 132
習題5.1 134
任務5.1 利用路由技術實現完整導航體系 136
5.2 深入組件 136
5.2.1 組件注冊及Props 136
5.2.2 組件事件 139
5.2.3 組件通信 140
習題5.2 143
任務5.2 開發(fā)購物車子組件 144
5.3 狀態(tài)管理 145
5.3.1 Pinia簡介 145
5.3.2 Pinia基本用法 147
5.3.3 Pinia核心概念 149
5.3.4 Pinia持久化存儲 152
習題5.3 155
任務5.3 實現用戶登錄功能并保持用戶狀態(tài) 156
第六章 聯調與部署 157
6.1 前后端聯調 158
6.1.1 Axios簡介 158
6.1.2 Axios基本用法 158
6.1.3 模擬后端接口 162
習題6.1 168
任務6.1 開發(fā)文章相關功能 169
6.2 項目打包部署 171
6.2.1 項目打包 171
6.2.2 基于Nginx部署 172
習題6.2 174
任務6.2 項目打包與本地部署 175
附錄A 習題參考答案 176