VUE.JS 3+TYPESCRIPT完全指南 版權(quán)信息
- ISBN:9787121462764
- 條形碼:9787121462764 ; 978-7-121-46276-4
- 裝幀:平裝-膠訂
- 冊(cè)數(shù):暫無
- 重量:暫無
- 所屬分類:>>
VUE.JS 3+TYPESCRIPT完全指南 本書特色
(1)資深前端技術(shù)大佬coderwhy經(jīng)驗(yàn)分享。 (2)適讀人群廣泛,初學(xué)、進(jìn)階需求均可滿足。 (3)內(nèi)容循序漸進(jìn),全面掌握Vue.js 3相關(guān)技能。 (4)深入剖析原理,理解Vue.js 3的內(nèi)部機(jī)制。 (5)實(shí)戰(zhàn)案例豐富,涵蓋大量真實(shí)的開發(fā)場(chǎng)景。 (6)多種實(shí)用工具,提高開發(fā)效率和代碼質(zhì)量。 (7)附帶資源多樣,源碼、付費(fèi)視頻和讀者群。
VUE.JS 3+TYPESCRIPT完全指南 內(nèi)容簡(jiǎn)介
本書是一本全面、深入介紹Vue.js 3和TypeScript前端開發(fā)技術(shù)的圖書。本書詳細(xì)介紹了Vue.js 3的新特性與優(yōu)勢(shì),包括模板語法、內(nèi)置指令、Options API、組件化、過渡動(dòng)畫、Composition API、Vue Router、Vuex 等核心知識(shí)點(diǎn);TypeScript 的基礎(chǔ)和進(jìn)階知識(shí),包括數(shù)據(jù)類型、類型別名、聯(lián)合類型、類型斷言、函數(shù)類型、類、接口、泛型、類型聲明等內(nèi)容。此外,本書還深入探討了前端工程化、第三方庫(kù)的集成與使用、企業(yè)級(jí)管理后臺(tái)的實(shí)現(xiàn)和自動(dòng)化部署等內(nèi)容,以及如何從零開始實(shí)現(xiàn)一個(gè)Mini-Vue.js 3框架,以便讀者深入理解Vue.js 3的核心原理。本書既適合有一定基礎(chǔ)的前端開發(fā)工程師、Web 開發(fā)者閱讀,也適合作為初學(xué)者學(xué)習(xí) Vue.js 3 和TypeScript的入門教材。本書旨在幫助讀者全面理解Vue.js 3和TypeScript的使用方法和原理,掌握實(shí)用的知識(shí)和技能,提高前端開發(fā)水平。
VUE.JS 3+TYPESCRIPT完全指南 目錄
1.1 認(rèn)識(shí)Vue.js 1
1.2 Vue.js與其他框架的對(duì)比 2
1.2.1 Vue.js、React和Angular三大框架對(duì)比 2
1.2.2 三大框架使用數(shù)據(jù)對(duì)比 2
1.3 Vue.js 2的缺點(diǎn) 4
1.4 Vue.js 3帶來的新變化 4
1.5 搭建開發(fā)環(huán)境 6
1.5.1 VS Code的下載和安裝 7
1.5.2 VS Code的基本配置 7
1.5.3 VS Code安裝插件 9
1.6 Vue.js 3的安裝和使用 10
1.6.1 使用CDN引入Vue.js 3 11
1.6.2 下載Vue.js 3源碼并在本地引入 14
1.7 計(jì)數(shù)器案例 16
1.7.1 原生JavaScript實(shí)現(xiàn)計(jì)數(shù)器 16
1.7.2 用Vue.js 3實(shí)現(xiàn)計(jì)數(shù)器 17
1.7.3 MVVM架構(gòu)模式 19
1.8 createApp的對(duì)象參數(shù) 20
1.8.1 template屬性 20
1.8.2 data屬性 22
1.8.3 methods屬性 22
1.8.4 其他屬性 24
1.9 VS Code生成代碼片段 24
1.10 本章小結(jié) 27
2 模板語法和內(nèi)置指令 28
2.1 插值語法 28
2.2 基本指令 30
2.2.1 v-once 30
2.2.2 v-text 31
2.2.3 v-html 32
2.2.4 v-pre 32
2.2.5 v-cloak 33
2.3 v-bind 34
2.3.1 綁定基本屬性 34
2.3.2 綁定class屬性 35
2.3.3 綁定style屬性 38
2.3.4 動(dòng)態(tài)綁定屬性 40
2.3.5 綁定一個(gè)對(duì)象 41
2.4 v-on 42
2.4.1 綁定事件 42
2.4.2 事件對(duì)象和傳遞參數(shù) 44
2.4.3 修飾符 45
2.5 條件渲染 46
2.5.1 v-if和v-else 46
2.5.2 v-if和template結(jié)合使用 48
2.5.3 v-show 49
2.5.4 v-show和v-if的區(qū)別 50
2.6 列表渲染 51
2.6.1 v-for的基本使用 51
2.6.2 v-for支持的類型 52
2.6.3 v-for和template結(jié)合使用 54
2.6.4 數(shù)組的更新檢測(cè) 55
2.7 key和diff算法 57
2.7.1 認(rèn)識(shí)VNode和VDOM 57
2.7.2 key的作用和diff算法 59
2.7.3 沒有key時(shí)的diff算法操作 60
2.7.4 有key時(shí)的diff算法操作 61
2.8 本章小結(jié) 64
3 Vue.js 3的Options API 65
3.1 計(jì)算屬性 65
3.1.1 認(rèn)識(shí)計(jì)算屬性 65
3.1.2 計(jì)算屬性的基本使用 66
3.1.3 計(jì)算屬性和methods的區(qū)別 69
3.1.4 計(jì)算屬性的setter和getter 71
3.2 監(jiān)聽器watch 73
3.2.1 watch的基本使用 73
3.2.2 watch配置選項(xiàng) 75
3.2.3 watch字符串、數(shù)組和API語法 78
3.2.4 watch深度監(jiān)聽 79
3.3 案例:書籍購(gòu)物車 80
3.3.1 基本功能介紹 80
3.3.2 搭建基本功能 81
3.3.3 搭建書籍列表 83
3.3.4 搭建“加購(gòu)物車”功能 84
3.3.5 優(yōu)化價(jià)格和購(gòu)買數(shù)量 86
3.3.6 完整代碼展示 86
3.4 本章小結(jié) 88
4 v-model和表單輸入 89
4.1 v-model的基本使用 89
4.2 v-model的實(shí)現(xiàn)原理 90
4.3 v-model綁定其他表單 91
4.4 v-model值的綁定 94
4.5 v-model的修飾符 94
4.5.1 .lazy修飾符 94
4.5.2 .number修飾符 94
4.5.3 .trim修飾符 96
4.6 v-model在組件上的使用 96
4.7 本章小結(jié) 96
5 Vue.js 3組件化開發(fā) 97
5.1 認(rèn)識(shí)組件化 97
5.2 Vue.js 3的組件化 98
5.3 Vue.js 3注冊(cè)組件 99
5.3.1 注冊(cè)全局組件 99
5.3.2 組件的命名規(guī)范 102
5.3.3 注冊(cè)局部組件 103
5.4 Vue.js 3開發(fā)模式 105
5.5 Vue.js 3支持SFC 106
5.6 本章小結(jié) 106
6 前端工程化 107
6.1 前端快速發(fā)展史 107
6.2 認(rèn)識(shí)webpack 108
6.3 Vue CLI腳手架 109
6.3.1 認(rèn)識(shí)Vue CLI 109
6.3.2 安裝Node.js 109
6.3.3 安裝Vue CLI 110
6.3.4 Vue CLI新建項(xiàng)目 111
6.3.5 Vue.js 3項(xiàng)目的目錄結(jié)構(gòu) 114
6.3.6 項(xiàng)目的運(yùn)行和打包 115
6.3.7 vue.config.js文件解析 117
6.4 認(rèn)識(shí)Vite 120
6.5 create-vue 腳手架 121
6.5.1 認(rèn)識(shí)create-vue 121
6.5.2 create-vue新建項(xiàng)目 121
6.5.3 Vue.js 3項(xiàng)目目錄結(jié)構(gòu) 122
6.5.4 項(xiàng)目的運(yùn)行和打包 123
6.5.5 vite.config.js文件解析 124
6.6 webpack和Vite的區(qū)別 126
6.7 本章小結(jié) 127
7 Vue.js 3組件化基礎(chǔ)詳解 128
7.1 組件的嵌套 130
7.1.1 搭建基本頁(yè)面 130
7.1.2 組件的拆分和嵌套 131
7.1.3 組件CSS的作用域 134
7.1.4 組件之間的通信 135
7.2 組件樣式的特性 135
7.2.1 Scoped CSS 135
7.2.2 CSS Modules 138
7.2.3 在CSS中使用v-bind 139
7.3 父子組件的相互通信 140
7.3.1 父組件傳遞數(shù)據(jù)給子組件 140
7.3.2 子組件傳遞數(shù)據(jù)給父組件 146
7.3.3 案例:選項(xiàng)卡TabControl實(shí)戰(zhàn) 150
7.4 非父子組件的相互通信 153
7.4.1 Provide/Inject依賴注入 153
7.4.2 全局事件總線 159
7.5 組件中的插槽 162
7.5.1 認(rèn)識(shí)插槽 162
7.5.2 插槽的使用 163
7.6 組件的作用域插槽 169
7.6.1 認(rèn)識(shí)渲染作用域 169
7.6.2 作用域插槽 169
7.6.3 獨(dú)占默認(rèn)插槽 171
7.7 本章小結(jié) 172
8 Vue.js 3組件化進(jìn)階詳解 173
8.1 動(dòng)態(tài)組件 173
8.1.1 v-if指令的實(shí)現(xiàn) 174
8.1.2 動(dòng)態(tài)組件的實(shí)現(xiàn) 175
8.1.3 動(dòng)態(tài)組件的傳參 176
8.1.4 keep-alive的使用 177
8.2 異步組件 180
8.2.1 webpack對(duì)代碼分包 180
8.2.2 在Vue.js 3中實(shí)現(xiàn)異步組件 182
8.2.3 異步組件和Suspense 185
8.3 獲取元素或組件的實(shí)例 187
8.3.1 $refs 187
8.3.2 $parent 189
8.4 組件生命周期函數(shù) 190
8.4.1 認(rèn)識(shí)組件的生命周期 190
8.4.2 生命周期函數(shù)的演練 191
8.5 在組件中使用v-model指令 193
8.5.1 v-model的基本使用方法 194
8.5.2 v-model綁定computed 195
8.5.3 組件上應(yīng)用多個(gè)v-model 197
8.5.4 v-model綁定對(duì)象類型 198
8.6 本章小結(jié) 200
9 Vue.js 3實(shí)現(xiàn)過渡動(dòng)畫 201
9.1 基本過渡動(dòng)畫 201
9.1.1 認(rèn)識(shí)過渡動(dòng)畫 201
9.1.2 過渡動(dòng)畫特有的類 203
9.1.3 CSS的Animation動(dòng)畫 204
9.1.4 Transition組件的常見屬性 205
9.2 第三方庫(kù)動(dòng)畫庫(kù) 210
9.2.1 Animate.css動(dòng)畫庫(kù) 210
9.2.2 GSAP動(dòng)畫庫(kù) 212
9.3 列表中的過渡動(dòng)畫 216
9.3.1 TransitionGroup的基本使用 217
9.3.2 列表元素的過渡動(dòng)畫 219
9.3.3 案例:列表元素的交替過渡 220
9.4 本章小結(jié) 222
10 Vue.js 3 Composition API詳解 224
10.1 Options API代碼的復(fù)用 224
10.1.1 Mixin混入 224
10.1.2 extends繼承 228
10.2 認(rèn)識(shí)Composition API 229
10.3 setup函數(shù)的基本使用 230
10.3.1 setup函數(shù)的參數(shù) 231
10.3.2 setup函數(shù)的返回值 233
10.3.3 setup函數(shù)的this 234
10.4 數(shù)據(jù)響應(yīng)式API 235
10.4.1 reactive 235
10.4.2 ref 236
10.5 響應(yīng)式工具reactive 239
10.5.1 readonly 239
10.5.2 isProxy 241
10.5.3 isReactive 241
10.5.4 isReadonly 241
10.5.5 toRaw 242
10.5.6 shallowReactive 242
10.5.7 shallowReadonly 242
10.6 響應(yīng)式工具ref 242
10.6.1 toRefs 242
10.6.2 toRef 244
10.6.3 isRef 245
10.6.4 unref 245
10.6.5 customRef 245
10.6.6 shallowRef 247
10.6.7 triggerRef 247
10.7 computed計(jì)算屬性 247
10.7.1 computed函數(shù)的基本使用 247
10.7.2 computed函數(shù)的get和set方法 248
10.8 watchEffect監(jiān)聽 249
10.8.1 watchEffect的基本使用 249
10.8.2 停止watchEffect監(jiān)聽 251
10.8.3 watchEffect清除副作用 251
10.8.4 watchEffect的執(zhí)行時(shí)機(jī) 252
10.9 watch監(jiān)聽 254
10.9.1 監(jiān)聽單個(gè)數(shù)據(jù)源 254
10.9.2 監(jiān)聽多個(gè)數(shù)據(jù)源 257
10.9.3 監(jiān)聽響應(yīng)式對(duì)象 258
10.10 組件生命周期函數(shù) 259
10.11 Provide/Inject依賴注入 260
10.11.1 提供數(shù)據(jù) 261
10.11.2 注入數(shù)據(jù) 262
10.11.3 提供和注入響應(yīng)式數(shù)據(jù) 263
10.12 案例:Composition API的實(shí)戰(zhàn) 264
10.12.1 計(jì)數(shù)器的兩種實(shí)現(xiàn)方式 264
10.12.2 代碼邏輯的封裝和復(fù)用 266
10.12.3 修改網(wǎng)頁(yè)的標(biāo)題 267
10.12.4 監(jiān)聽頁(yè)面滾動(dòng)位置 268
10.13 <script setup>語法 270
10.13.1 <script setup>的基本使用 270
10.13.2 defineProps和defineEmits 272
10.13.3 defineExpose 273
10.13.4 useSlots和useAttrs 274
10.14 本章小結(jié) 275
11 Vue.js 3組件化高級(jí)詳解 276
11.1 render函數(shù) 276
11.1.1 認(rèn)識(shí)h函數(shù) 276
11.1.2 h函數(shù)的基本使用 277
11.1.3 render函數(shù)實(shí)現(xiàn)計(jì)數(shù)器 278
11.1.4 setup函數(shù)實(shí)現(xiàn)計(jì)數(shù)器 279
11.1.5 在render函數(shù)中實(shí)現(xiàn)插槽 279
11.1.6 組件的JSX語法 281
11.2 自定義指令 283
11.2.1 自定義指令的基本使用 283
11.2.2 自定義指令的生命周期函數(shù) 285
11.2.3 自定義指令的參數(shù)和修飾符 287
11.2.4 案例:自定義時(shí)間格式化指令 288
11.3 teleport內(nèi)置組件 290
11.3.1 認(rèn)識(shí)teleport組件 290
11.3.2 teleport的基本使用 290
11.3.3 teleport中嵌套組件 291
11.3.4 多個(gè)teleport組件的使用 291
11.4 Vue.js 3的插件開發(fā) 292
11.4.1 認(rèn)識(shí)Vue.js 3插件 292
11.4.2 對(duì)象類型的插件 292
11.4.3 函數(shù)類型的插件 293
11.5 nextTick函數(shù)的原理 294
11.6 本章小結(jié) 297
12 Vue Router路由 299
12.1 認(rèn)識(shí)Vue Router 299
12.1.1 什么是前端路由 299
12.1.2 前端路由的原理 300
12.1.3 認(rèn)識(shí)Vue Router 3
VUE.JS 3+TYPESCRIPT完全指南 相關(guān)資料
本書手把手教你使用Vue.js 3和TypeScript,詳細(xì)講解了開發(fā)中常用的組件和工具。最吸引我的是最后一章,作者對(duì)Vue.js原理進(jìn)行剖析,并手寫了一個(gè)Mini-Vue.js 3框架,對(duì)想要深入理解Vue.js 3原理的讀者來說,這是一道饕餮大餐。 ——京東零售組件庫(kù)NutUI原負(fù)責(zé)人 周濤 一本好的技術(shù)書可以讓你更快地成為優(yōu)秀開發(fā)者,《Vue.js 3 TypeScript完全指南》就是這樣一本書。本書提供了開發(fā)大型和復(fù)雜Web應(yīng)用所需的幾乎所有技能和知識(shí),并且對(duì)新手非常友好,能讓你在入門過程中少走彎路。 ——小碼哥創(chuàng)始人、CEO 李明杰?? 本書對(duì)Vue.js 3的各種特性和官方生態(tài)、TypeScript、后臺(tái)系統(tǒng)、項(xiàng)目部署、手寫Mini-Vue.js 3框架等多方面進(jìn)行循序漸進(jìn)的講解,并輔以案例,非常值得前端開發(fā)者學(xué)習(xí)。我相信,學(xué)習(xí)本書會(huì)對(duì)你解決工作中的問題有很大幫助。 ——源碼共讀發(fā)起人、掘金年度人氣作者 若川?? 在眾多的前端開發(fā)相關(guān)圖書中,這無疑是一本為初學(xué)者量身定制的寶典。本書內(nèi)容深入淺出,為讀者構(gòu)建了一座堅(jiān)固的知識(shí)橋梁。對(duì)剛步入前端領(lǐng)域的人來說,本書是你的不二選擇。希望每位讀者都能在這本書的引領(lǐng)下順利啟航,領(lǐng)略Vue.js 3與TypeScript的強(qiáng)大魅力,開啟一段精彩的編程之旅。?? ——自媒體人 前端小智 本書內(nèi)容全面,包含Vue.js 3和TypeScript的基礎(chǔ)知識(shí)、Vue.js 3新特性和實(shí)踐技巧,可幫助讀者快速開始實(shí)戰(zhàn)應(yīng)用。本書中的大量結(jié)論都直接來源于官方,保證了技術(shù)的“原汁原味”。在互聯(lián)網(wǎng)行業(yè)降本增效的背景下,越來越多的業(yè)務(wù)技術(shù)選型開始轉(zhuǎn)向前端技術(shù)棧,很多移動(dòng)開發(fā)者面臨著轉(zhuǎn)型的陣痛。這本凝聚了作者多年實(shí)戰(zhàn)開發(fā)經(jīng)驗(yàn)的書,絕對(duì)不可錯(cuò)過。 ——美團(tuán)大前端技術(shù)專家 蔣宏光 本書將Vue.js和TypeScript結(jié)合起來,并且深入淺出地介紹了Vue.js的發(fā)展歷史,具體的實(shí)踐案例和代碼也很豐富,非常適合前端領(lǐng)域的入門者,以及想進(jìn)一步提高自身技術(shù)水平的讀者。這是一本值得閱讀的好書。 ——美團(tuán)大前端技術(shù)專家 歐柏泉 隨著現(xiàn)代Web開發(fā)的不斷演進(jìn),掌握Vue.js 3和TypeScript十分重要。本書不僅是作者深入研究的結(jié)晶,更是其豐富經(jīng)驗(yàn)的集結(jié)。憑借清晰的知識(shí)講解和應(yīng)用示例,本書能幫助你深入了解Vue.js 3和TypeScript,帶領(lǐng)你在前端技術(shù)的路上暢行無阻。無須猶豫,閱讀這本書,準(zhǔn)備迎接Web開發(fā)的未來。 ——T技術(shù)沙龍發(fā)起人 鄭宜東
VUE.JS 3+TYPESCRIPT完全指南 作者簡(jiǎn)介
王紅元(網(wǎng)名coderwhy),擔(dān)任廣州市弘源科教軟件有限公司CEO、澳大利亞The WAIN公司CTO,作為騰訊AI高校訓(xùn)練營(yíng)的特聘講師,曾為多所雙一流高校授課。在國(guó)內(nèi)外大型項(xiàng)目和軟件系統(tǒng)中,負(fù)責(zé)架構(gòu)設(shè)計(jì)和研發(fā)工作,曾兼任多家公司的技術(shù)顧問,協(xié)助解決開發(fā)過程中的關(guān)鍵問題。精通多種編程語言,包括C/C 、Python、Java、Objective-C、Swift、JavaScript和TypeScript等,對(duì)即時(shí)聊天和流媒體技術(shù)有深入研究。目前致力于不斷提高自身技能,為企業(yè)、開源社區(qū)及學(xué)員做出更多貢獻(xiàn)。 劉軍,曾在深圳市華云中盛科技股份有限公司擔(dān)任前端負(fù)責(zé)人,廣州市弘源科教軟件有限公司聯(lián)合創(chuàng)始人之一,擁有8年前端開發(fā)經(jīng)驗(yàn)。精通Vue.js、React、TypeScript、webpack、Vite、Node、Docker、CI/CD,以及Java、Android等技術(shù)棧,擅長(zhǎng)微前端、中后臺(tái)、組件庫(kù)、腳手架、公眾號(hào)、小程序、大屏可視化等領(lǐng)域的工作。
- >
中國(guó)人在烏蘇里邊疆區(qū):歷史與人類學(xué)概述
- >
煙與鏡
- >
史學(xué)評(píng)論
- >
羅庸西南聯(lián)大授課錄
- >
朝聞道
- >
自卑與超越
- >
莉莉和章魚
- >
李白與唐代文化