Vue.js從入門到項目實戰(zhàn)

第一篇 概念篇——扎根于基礎
第1章 引言 002
1.1 前端技術的發(fā)展002
1.1.1 從靜態(tài)走向動態(tài) 002
1.1.2 從后端走向前端 003
1.1.3 從前端走向全端 005
1.2 MVVM族員——Vue.js 008
1.2.1 從MVC到MVVM 008
1.2.2 Vue.js簡介 009
1.3 Vue與React 010
1.3.1 虛擬DOM 010
1.3.2 功能性組件 011
1.3.3 輕量級——將與核心庫無關的業(yè)務封裝成獨立庫 011
1.3.4 視圖模板 011
1.3.5 其他 012
1.4 Vue與Angular 013
1.4.1 模板語法 013
1.4.2 臟檢測 013
1.4.3 雙向數(shù)據(jù)綁定 014
1.4.4 學習曲線 015
第2章 基本介紹 016
2.1 安裝和引入016
2.1.1 如何引入Vue.js 016
2.1.2 安裝Vue Devtools 017
2.2 Vue實例介紹 019
2.2.1 簡單實例 019
2.2.2 生命周期 020
目錄
VIII
Vue. js從入門到項目實戰(zhàn)
2.3 數(shù)據(jù)響應式原理024
2.3.1 初識數(shù)據(jù)鏈 024
2.3.2 函數(shù)式編程 025
2.3.3 Vue中的數(shù)據(jù)鏈 026
2.3.4 數(shù)據(jù)綁定視圖 028
第3章 Vue語法 030
3.1 插值綁定030
3.1.1 文本插值 030
3.1.2 HTML插值 031
3.2 屬性綁定033
3.2.1 指令v-bind 033
3.2.2 類名和樣式綁定 034
3.3 事件綁定037
3.3.1 指令v-on 037
3.3.2 常見修飾符 039
3.3.3 按鍵修飾符 041
3.3.4 組合修飾符 042
3.4 雙向綁定044
3.4.1 指令v-model 044
3.4.2 v-model與修飾符 047
3.4.3 v-model與自定義組件 048
3.5 條件渲染和列表渲染050
3.5.1 指令v-if和v-show 050
3.5.2 指令v-for 053
3.5.3 列表渲染中的key 057
第4章 Vue選項 059
4.1 數(shù)據(jù)和方法059
4.1.1 數(shù)據(jù)選項 059
IX
目 錄
4.1.2 屬性選項 065
4.1.3 方法選項 067
4.1.4 計算屬性 068
4.1.5 偵聽屬性 072
4.2 DOM渲染 074
4.2.1 指定被掛載元素 074
4.2.2 視圖的字符串模板 075
4.2.3 渲染函數(shù)render 076
4.2.4 選項的優(yōu)先級 083
4.3 封裝復用085
4.3.1 過濾器 085
4.3.2 自定義指令 086
4.3.3 組件的注冊 090
4.3.4 混入的使用 091
第5章 Vue內置組件 095
5.1 組件服務095
5.1.1 動態(tài)組件 095
5.1.2 使用插槽分發(fā)內容 097
5.1.3 組件的緩存 103
5.2 過渡效果104
5.2.1 單節(jié)點的過渡 104
5.2.2 多節(jié)點的過渡 113
第6章 Vue項目化 117
6.1 快速構建項目117
6.1.1 Vue CLI簡介 117
6.1.2 使用Vue CLI構建項目 118
6.1.3 項目目錄介紹 119
6.2 前端路由123
6.2.1 前端路由的簡單實現(xiàn) 123
6.2.2 Vue中的前端路由 127
6.3 狀態(tài)管理132
6.3.1 對象引用 133
6.3.2 狀態(tài)管理器Vuex 133
6.3.3 在項目中使用Vuex 138
第二篇 實戰(zhàn)篇 —— 提升于項目
第7章 打造線上商城（一） 144
7.1 項目規(guī)劃144
7.1.1 需求分析 144
7.1.2 流程分析 146
7.2 項目展示147
7.2.1 首頁 147
7.2.2 商品詳情 150
7.2.3 購物車 151
7.2.4 訂單 152
第8章 打造線上商城（二） 154
8.1 項目構建154
8.1.1 目錄結構 154
8.1.2 webpack是什么？ 155
8.1.3 Font Awesome圖標庫 157
8.2 動態(tài)資源和數(shù)據(jù)159
8.2.1 關于配置 159
8.2.2 動態(tài)資源 162
8.2.3 動態(tài)數(shù)據(jù)的存儲 163
8.3 自定義組件164
8.3.1 幻燈片 164
8.3.2 復選框 168
第9章 企業(yè)官網(wǎng)的建設 171
9.1 響應式設計171
9.1.1 響應式設計 171
9.1.2 媒體查詢 172
9.1.3 JS布局 174
9.2 頁面開發(fā)175
9.2.1 頁面切換 175
9.2.2 Swiper組件 176
9.2.3 劃分內容區(qū) 177
9.3 多語種網(wǎng)站的建設179
9.3.1 將一切納入配置 180
9.3.2 將配置綁定到視圖 183
第10章 我的掌上新聞 186
10.1 應用介紹186
10.1.1 應用首屏 186
10.1.2 應用首頁 187
10.1.3 新聞詳情 189
10.1.4 搜索頁面 190
10.1.5 搜索結果 193
10.2 項目構建193
10.2.1 項目結構 193
10.2.2 數(shù)據(jù)流圖 198
第11章 SVG畫圖板 199
11.1 SVG簡介 199
11.1.1 有關SVG的三個問題 199
11.1.2 基本圖形的使用 201
11.1.3 SVG中的漸變 202
11.2 項目介紹 204
11.2.1 頁面介紹 204
11.2.2 代碼簡析 208
附錄 拓 展 篇
附錄A Git入門 218
附錄B NPM入門 221
附錄C Webpack入門 224
附錄D 閉包和對象引用 230
附錄E 常見的ECMAScript 6語法 233