圖書(shū)導(dǎo)航
作者:黎芷杉、嚴(yán)圣華、蔣榮新
字?jǐn)?shù):358
頁(yè)數(shù):240
版次:1
定價(jià):59.8
ISBN:978-7-313-30360-8
出版日期:2024/09
Vue.js是目前流行的前端框架之一。本書(shū)從初學(xué)者的角度出發(fā),使用通俗易懂的語(yǔ)言、豐富多彩的案例,詳細(xì)地介紹了使用Vue.js 3進(jìn)行前端開(kāi)發(fā)需要掌握的知識(shí)和技術(shù)。本書(shū)內(nèi)容全面、結(jié)構(gòu)合理、循序漸進(jìn)、講練結(jié)合,共分為8個(gè)項(xiàng)目,分別為Vue.js入門、Vue.js開(kāi)發(fā)基礎(chǔ)、Vue.js指令、Vue.js組件、過(guò)渡動(dòng)畫、路由管理、網(wǎng)絡(luò)請(qǐng)求與狀態(tài)管理、綜合案例——開(kāi)發(fā)圖書(shū)銷售網(wǎng)站。
本書(shū)可作為各類院校計(jì)算機(jī)應(yīng)用技術(shù)、軟件技術(shù)等相關(guān)專業(yè)的教材,也可作為前端開(kāi)發(fā)相關(guān)從業(yè)人員的參考用書(shū)。
項(xiàng)目1Vue.js入門
1.1初識(shí)Vue.js
1.1.1Vue.js的定義
1.1.2Vue.js的特性
1.1.3Vue.js的開(kāi)發(fā)模式
1.2Vue.js的開(kāi)發(fā)環(huán)境
1.2.1VisualStudioCode編輯器
1.2.2Node.js環(huán)境
1.2.3常見(jiàn)的包管理工具
1.2.4瀏覽器
1.3Vue.js項(xiàng)目
1.3.1項(xiàng)目構(gòu)建工具
1.3.2項(xiàng)目的創(chuàng)建方式
1.3.3項(xiàng)目的目錄結(jié)構(gòu)
1.3.4項(xiàng)目的運(yùn)行過(guò)程
項(xiàng)目實(shí)施1——搭建Vue.js的開(kāi)發(fā)環(huán)境
項(xiàng)目實(shí)施2——創(chuàng)建訂餐系統(tǒng)項(xiàng)目
項(xiàng)目2Vue.js開(kāi)發(fā)基礎(chǔ)
2.1Vue.js實(shí)例
2.1.1Vue.js實(shí)例的創(chuàng)建方法
2.1.2數(shù)據(jù)和方法
示例2-1HelloVue.js
2.2數(shù)據(jù)綁定
2.2.1文本插值
2.2.2HTML綁定
2.2.3屬性綁定
2.2.4JavaScript表達(dá)式
示例2-2不同數(shù)據(jù)綁定方式的應(yīng)用
2.2.5響應(yīng)式數(shù)據(jù)綁定
示例2-3定義響應(yīng)式數(shù)據(jù)
2.3計(jì)算屬性與偵聽(tīng)器
2.3.1計(jì)算屬性
示例2-4反轉(zhuǎn)字符串
2.3.2偵聽(tīng)器
示例2-5單位換算
項(xiàng)目實(shí)施1——制作訂餐系統(tǒng)登錄模塊
項(xiàng)目實(shí)施2——制作訂餐系統(tǒng)商家簡(jiǎn)介模塊
項(xiàng)目3Vue.js指令
3.1認(rèn)識(shí)指令
3.2條件渲染指令
示例3-1條件渲染指令的應(yīng)用
3.3循環(huán)渲染指令
示例3-2循環(huán)渲染列表
3.4屬性綁定指令
3.4.1class屬性綁定
示例3-3為class屬性綁定數(shù)據(jù)
3.4.2style屬性綁定
示例3-4為style屬性綁定數(shù)據(jù)
3.5事件處理指令
3.5.1事件監(jiān)聽(tīng)與處理
示例3-5監(jiān)聽(tīng)并處理單擊事件
3.5.2事件修飾符
3.6表單輸入綁定指令
3.6.1雙向數(shù)據(jù)綁定
示例3-6制作調(diào)查問(wèn)卷
3.6.2表單修飾符
示例3-7表單修飾符的簡(jiǎn)單應(yīng)用
3.7自定義指令
3.7.1自定義指令的注冊(cè)和使用
3.7.2鉤子函數(shù)
示例3-8注冊(cè)并使用自定義指令
3.7.3簡(jiǎn)化形式
項(xiàng)目實(shí)施——制作訂餐系統(tǒng)商品評(píng)價(jià)模塊
項(xiàng)目4Vue.js組件
4.1認(rèn)識(shí)組件
4.2組件的定義方式
4.2.1在HTML文件中定義組件
4.2.2在Vue.js項(xiàng)目中定義組件
4.3組件的注冊(cè)和使用
4.3.1組件注冊(cè)
4.3.2組件使用
示例4-1注冊(cè)并使用組件
4.4組件之間的數(shù)據(jù)傳遞
4.4.1父組件向子組件傳遞數(shù)據(jù)
示例4-2實(shí)現(xiàn)父組件向子組件傳遞數(shù)據(jù)
4.4.2子組件向父組件傳遞數(shù)據(jù)
示例4-3實(shí)現(xiàn)子組件向父組件傳遞數(shù)據(jù)
4.4.3跨級(jí)組件之間傳遞數(shù)據(jù)
示例4-4實(shí)現(xiàn)跨級(jí)組件之間傳遞數(shù)據(jù)
4.5插槽
4.5.1默認(rèn)插槽
4.5.2具名插槽
4.5.3作用域插槽
示例4-5使用插槽分發(fā)模板內(nèi)容
4.6動(dòng)態(tài)組件
4.6.1定義動(dòng)態(tài)組件
4.6.2使用KeepAlive組件實(shí)現(xiàn)組件緩存
示例4-6動(dòng)態(tài)切換組件
4.7組件的生命周期
示例4-7使用生命周期鉤子函數(shù)
項(xiàng)目實(shí)施——制作訂餐系統(tǒng)商品訂購(gòu)模塊
項(xiàng)目5過(guò)渡動(dòng)畫
5.1單元素或單組件過(guò)渡
5.1.1Transition組件
5.1.2使用CSS3樣式實(shí)現(xiàn)過(guò)渡動(dòng)畫
5.1.3使用animate.css實(shí)現(xiàn)過(guò)渡動(dòng)畫
5.1.4使用鉤子函數(shù)實(shí)現(xiàn)過(guò)渡動(dòng)畫
5.2多元素過(guò)渡與多組件過(guò)渡
5.2.1多元素過(guò)渡
5.2.2多組件過(guò)渡
5.3列表過(guò)渡
示例5-1實(shí)現(xiàn)列表的過(guò)渡動(dòng)畫
5.4可復(fù)用過(guò)渡
示例5-2封裝并復(fù)用過(guò)渡動(dòng)畫
項(xiàng)目實(shí)施——在訂餐系統(tǒng)中添加過(guò)渡動(dòng)畫
6.1認(rèn)識(shí)路由
6.2VueRouter的安裝與使用
6.2.1VueRouter的安裝
6.2.2VueRouter的使用
示例6-1安裝并使用VueRouter
6.3嵌套路由
示例6-2定義并使用嵌套路由
6.4動(dòng)態(tài)路由匹配
6.4.1定義路徑參數(shù)
6.4.2獲取參數(shù)值
示例6-3實(shí)現(xiàn)動(dòng)態(tài)路由匹配
6.5命名路由與路由視圖
6.5.1命名路由
6.5.2命名路由視圖
示例6-4為路由和路由視圖命名
6.6重定向與別名
6.6.1重定向
6.6.2別名
示例6-5實(shí)現(xiàn)路由重定向并為路由添加別名
6.7編程式導(dǎo)航
示例6-6使用編程式導(dǎo)航的方式實(shí)現(xiàn)頁(yè)面導(dǎo)航
項(xiàng)目實(shí)施——切換顯示訂餐系統(tǒng)不同模塊的內(nèi)容
項(xiàng)目7網(wǎng)絡(luò)請(qǐng)求與狀態(tài)管理
7.1網(wǎng)絡(luò)請(qǐng)求
7.1.1Axios的安裝
7.1.2Axios的使用
7.1.3攔截器
示例7-1使用Axios實(shí)現(xiàn)網(wǎng)絡(luò)請(qǐng)求
7.2狀態(tài)管理
7.2.1Vuex的安裝
7.2.2Vuex的使用
7.2.3持久化存儲(chǔ)
示例7-2使用Vuex進(jìn)行狀態(tài)管理
項(xiàng)目實(shí)施——實(shí)現(xiàn)登錄功能并管理登錄狀態(tài)
項(xiàng)目8綜合案例——開(kāi)發(fā)圖書(shū)銷售網(wǎng)站
8.1項(xiàng)目背景
8.2需求分析
8.3模塊設(shè)計(jì)
8.4項(xiàng)目搭建
8.5項(xiàng)目開(kāi)發(fā)
8.5.1實(shí)現(xiàn)路由管理和狀態(tài)管理
8.5.2制作導(dǎo)航模塊
8.5.3制作登錄模塊
8.5.4制作圖書(shū)展示模塊
8.5.5制作圖書(shū)詳情模塊
8.5.6制作圖書(shū)搜索模塊
8.5.7制作購(gòu)物車模塊
8.6項(xiàng)目運(yùn)行
參考文獻(xiàn)