Vue 企業(yè)開發(fā)實(shí)戰(zhàn)

第 1章　大覓項(xiàng)目架構(gòu)設(shè)計(jì) 1
任務(wù)1　大覓項(xiàng)目業(yè)務(wù)場景　3
1．1．1　大覓項(xiàng)目業(yè)務(wù)分析　4
1．1．2　大覓項(xiàng)目業(yè)務(wù)梳理　6
1．1．3　大覓項(xiàng)目技術(shù)棧選型　7
任務(wù)2　大覓項(xiàng)目環(huán)境搭建　7
1．2．1　Node．js的介紹　8
1．2．2　什么是NPM　9
1．2．3　安裝cnpm　9
1．2．4　Vue-cli腳手架　10
1．2．5　上機(jī)訓(xùn)練　14
任務(wù)3　前端架構(gòu)設(shè)計(jì)　14
1．3．1　分層架構(gòu)&模塊化　14
1．3．2　分離方式　15
1．3．3　Visual Studio Code 免費(fèi)跨平臺(tái)編輯器　16
1．3．4　UI框架　17
1．3．5　上機(jī)訓(xùn)練　20
1．3．6　構(gòu)建工具Webpack　20
1．3．7　上機(jī)訓(xùn)練　23
本章作業(yè)　24
第　2章 大覓項(xiàng)目中ES6的使用　25
任務(wù)1　let和const命令　27
2．1．1　let命令　27
2．1．2　上機(jī)訓(xùn)練　30
2．1．3　const命令　30
任務(wù)2　變量的解構(gòu)賦值　31
2．2．1　數(shù)組的解構(gòu)賦值　31
2．2．2　對象的解構(gòu)賦值　33
2．2．3　上機(jī)訓(xùn)練　34
任務(wù)3　使用箭頭函數(shù)　34
2．3．1　箭頭函數(shù)起因　34
2．3．2　箭頭函數(shù)定義　36
2．3．3　和普通函數(shù)的區(qū)別　36
2．3．4　箭頭函數(shù)不適用場景　38
任務(wù)4　Map數(shù)據(jù)結(jié)構(gòu)　40
2．4．1　Map數(shù)據(jù)結(jié)構(gòu)的特點(diǎn)　40
2．4．2　如何創(chuàng)建Map　41
2．4．3　Map常用屬性及方法　41
任務(wù)5　Module的語法　44
2．5．1　概述　44
2．5．2　export、import命令　44
2．5．3　export default命令　46
任務(wù)6　Promise對象　46
2．6．1　Promise的含義　46
2．6．2　基本用法　47
本章作業(yè)　48
第3章　大覓項(xiàng)目的路由配置　49
任務(wù)1　什么是前端路由　50
3．1．1　什么是路由　50
3．1．2　前端路由　51
3．1．3　前端路由的使用場景　51
任務(wù)2　Vue Router基本使用　52
3．2．1　安裝路由　52
3．2．2　建立路由器模塊　53
3．2．3　啟動(dòng)路由器　53
3．2．4　路由重定向　54
3．2．5　路由懶加載　55
3．2．6　　56
3．2．7　路由對象屬性　57
任務(wù)3　頁面間導(dǎo)航　57
3．3．1　router．push　58
3．3．2　router．replace　58
3．3．3　router．go　58
本章作業(yè)　59
第4章　初識(shí)Vue．js　61
任務(wù)1　Vue．js是什么　62
4．1．1　MVVM模式　63
4．1．2　Vue．js的開發(fā)模式　63
4．1．3　單文件組件　64
任務(wù)2　Vue實(shí)例與數(shù)據(jù)綁定　65
4．2．1　實(shí)例與數(shù)據(jù)　65
4．2．2　插值表達(dá)式　66
4．2．3　生命周期　68
任務(wù)3　class與style綁定　71
4．3．1　了解v-bind指令　71
4．3．2　綁定class的方式　72
4．3．3　綁定內(nèi)聯(lián)樣式　76
本章作業(yè)　77
第5章　大覓項(xiàng)目中與服務(wù)端通信　79
任務(wù)1　connect-mock-middleware工具的使用　81
5．1．1　添加middleware　81
5．1．2　寫mock文件　81
任務(wù)2　Mock．js語法　84
5．2．1　Mock．js基本介紹　84
5．2．2　Mock．js語法規(guī)范　84
任務(wù)3　snail mock工具使用　87
任務(wù)4　Axios的安裝及配置　88
5．4．1　Axios基本介紹　88
5．4．2　Axios安裝使用　88
5．4．3　Axios封裝及調(diào)用　90
5．4．4　請求設(shè)置　90
5．4．5　返回響應(yīng)概要　91
5．4．6　攔截器　92
5．4．7　上機(jī)訓(xùn)練　93
任務(wù)5　大覓項(xiàng)目的服務(wù)端通信配置　93
本章作業(yè)　93
第6章　Vue．js指令　95
任務(wù)1　條件渲染指令　96
6．1．1　v-if指令　97
6．1．2　v-else指令　97
6．1．3　v-show指令　98
6．1．4　v-if與v-show的選擇　99
任務(wù)2　列表渲染v-for指令　100
6．2．1　基本用法　100
6．2．2　遍歷對象　100
6．2．3　遍歷數(shù)組　101
6．2．4　key屬性　102
6．2．5　上機(jī)訓(xùn)練　102
任務(wù)3　方法與事件　103
6．3．1　v-on指令　103
6．3．2　修飾符　106
任務(wù)4　v-model與表單　108
6．4．1　基本用法　108
6．4．2　修飾符　109
本章作業(yè)　109
第7章　組件詳解　113
任務(wù)1　組件概念與復(fù)用　114
7．1．1　為什么使用組件　114
7．1．2　組件的復(fù)用　115
任務(wù)2　使用props傳遞數(shù)據(jù)　115
7．2．1　基本用法　115
7．2．2　單向數(shù)據(jù)流　119
7．2．3　上機(jī)訓(xùn)練　121
任務(wù)3　組件通信　121
7．3．1　自定義事件及$emit方法　121
7．3．2　兄弟組件通信的處理方式　123
任務(wù)4　slot分發(fā)內(nèi)容　126
7．4．1　什么是slot　126
7．4．2　匿名slot　126
7．4．3　具名slot　128
本章作業(yè)　129
第8章　計(jì)算屬性和偵聽器　131
任務(wù)1　計(jì)算屬性　132
8．1．1　什么是計(jì)算屬性　132
8．1．2　計(jì)算屬性用法　134
8．1．3　計(jì)算屬性緩存　137
8．1．4　上機(jī)訓(xùn)練　139
任務(wù)2　偵聽器　139
8．2．1　什么是偵聽器　139
8．2．2　計(jì)算屬性vs偵聽器　140
本章作業(yè)　143
第9章　大覓項(xiàng)目中插件的使用　145
任務(wù)1　百度地圖插件　146
9．1．1　百度地圖基本介紹　146
9．1．2　百度地圖基本使用　147
9．1．3　上機(jī)訓(xùn)練　150
任務(wù)2　狀態(tài)管理與Vuex　151
9．2．1　狀態(tài)管理與使用場景　151
9．2．2　Vuex基本用法　152
任務(wù)3　二維碼插件　156
9．3．1　使用場景　156
9．3．2　QRCode插件使用　156
本章作業(yè)　157
第　10章 大覓項(xiàng)目總結(jié)　159
任務(wù)1　大覓項(xiàng)目起步　160
10．1．1　項(xiàng)目前期準(zhǔn)備　160
10．1．2　Vue框架　162
任務(wù)2　梳理大覓項(xiàng)目技能點(diǎn)　162
10．2．1　項(xiàng)目框架搭建及配置　162
10．2．2　梳理項(xiàng)目技能點(diǎn)　163
本章作業(yè)　168