●第1章 Vue.js基礎入門 001
教學導航 001
1.1 初識Vue 001
1.1.1 前端技術的發展 001
1.1.2 什麼是Vue 002
1.1.3 Vue的優勢 002
1.2 搭建Vue開發環境 003
1.2.1 Visual Studio Code編輯器 003
1.2.2 Vue的下載和引入 004
1.2.3 git-bash命令行工具 004
1.2.4 Node.js環境 005
1.2.5 npm包管理工具 006
1.2.6 Chrome瀏覽器和vue-devtools擴展 007
1.2.7 Hello World案例 008
1.3 webpack打包工具 009
1.3.1 安裝webpack 009
1.3.2 webpack簡單使用 009
1.3.3 構建Vue項目 010
本章小結 011
課後習題 011
第2章Vue開發基礎（上） 013
教學導航 013
2.1 Vue實例 013
2.1.1 創建Vue實例 013
2.1.2 el專享根標簽 014
2.1.3 data初始數據 015
2.1.4 methods定義方法 015
2.1.5 computed計算屬性 016
2.1.6 watch狀態監聽 017
2.1.7 filters過濾器 018
2.2 Vue數據綁定 020
2.2.1 綁定樣式 020
2.2.2 內置指令 022
2.2.3 學生列表案例 027
2.3 Vue事件 028
2.3.1 事件監聽 028
2.3.2 事件修飾符 029
2.4 Vue組件 033
2.4.1 什麼是組件 033
2.4.2 局部注冊組件 034
2.4.3 template模板 035
2.4.4 組件之間的數據傳遞 036
2.4.5 組件切換 038
2.5 Vue的生命周期 039
2.5.1 鉤子函數 039
2.5.2 實例創建 040
2.5.3 頁面掛載 040
2.5.4 數據更新 041
2.5.5 實例銷毀 042
本章小結 043
課後習題 043
第3章Vue開發基礎（下） 045
教學導航 045
3.1 全局API 045
3.1.1 Vue.directive 045
3.1.2 Vue.use 046
3.1.3 Vue.extend 047
3.1.4 Vue.set 048
3.1.5 Vue.mixin 049
3.2 實例屬性 049
3.2.1 vm.$props 050
3.2.2 vm.$options 052
3.2.3 vm.$el 052
3.2.4 vm.$children 053
3.2.5 vm.$root 054
3.2.6 vm.$slots 054
3.2.7 vm.$attrs 056
3.3 全局配置 056
3.3.1 productionTip 056
3.3.2 silent 057
3.3.3 devtools 058
3.4 組件進階 058
3.4.1 mixins 059
3.4.2 render 060
3.4.3 createElement 061
本章小結 062
課後習題 062
第4章Vue過渡和動畫 064
教學導航 064
4.1過渡和動畫基礎 064
4.1.1 什麼是過渡和動畫 064
4.1.2 transition組件 065
4.1.3 自定義類名 067
4.1.4 使用@keyframes創建CSS動畫 069
4.1.5 鉤子函數實現動畫 070
4.1.6 Vue結合Velocity.js實現動畫 071
4.2素過渡 072
4.2.1 不同素的過渡 072
4.2.2 相同素的過渡 073
4.2.3 過渡模式 075
4.3 多個組件過渡 076
4.4 列表過渡 077
4.4.1 什麼是列表過渡 077
4.4.2 列表的進入和離開過渡 077
4.4.3 列表的排序過渡 078
4.4.4 列表的交錯過渡 080
4.4.5 可復用的過渡 082
本章小結 085
課後習題 086
第5章Vue路由 087
教學導航 087
5.1 初識路由 087
5.2 vue-router 089
5.2.1 vue-router的工作原理 089
5.2.2 vue-router的基本使用 090
5.2.3 路由對像的屬性 091
5.3 用戶登錄注冊案例 092
5.3.1 案例分析 092
5.3.2 準備工作 093
5.3.3 代碼實現 096
5.4 動態路由 101
5.4.1 什麼是動態路由 101
5.4.2 query方式傳參 102
5.4.3 params方式傳參 103
5.5 嵌套路由 104
5.5.1 什麼是嵌套路由 104
5.5.2 嵌套路由案例 105
5.6 命名路由 107
5.6.1 什麼是命名路由 107
5.6.2 命名路由案例 108
5.7 命名視圖 109
5.7.1 什麼是命名視圖 109
5.7.2 命名視圖案例 109
5.8 編程式導航 110
5.8.1 router.push() 110
5.8.2 router.replace() 113
5.8.3 router.go() 113
本章小結 114
課後習題 114
第6章Vuex狀態管理 116
教學導航 116
6.1 初識Vuex 116
6.1.1 什麼是Vuex 116
6.1.2 Vuex的下載和安裝 117
6.1.3 計數器案例 120
6.1.4 Vuex狀態管理模式 121
6.2 Vuex配置選項 122
6.2.1 actions 122
6.2.2 mutations 125
6.2.3 getters 128
6.2.4 modules 130
6.2.5 plugins 131
6.2.6 devtools 132
6.3 Vuex中的API 133
6.3.1 模塊注冊 133
6.3.2 狀態替換 134
6.4 購物車案例 135
6.4.1 案例分析 135
6.4.2 代碼實現 136
本章小結 142
課後習題 143
第7章Vue開發環境 144
教學導航 144
7.1 Vue CLI腳手架工具 144
7.1.1 安裝前的注意事項 144
7.1.2 全局安裝@vue/cli 145
7.1.3 使用vue create命令創建項目 145
7.1.4 使用GUI創建項目 147
7.2 插件 149
7.2.1 CLI插件 150
7.2.2 安裝插件 150
7.3 CLI服務和配置文件 151
7.3.1 CLI服務 151
7.3.2 配置文件 152
7.3.3 配置多頁應用 154
7.4 環境變量和模式 157
7.4.1 環境變量 157
7.4.2 模式 158
7.5 靜態資源管理 158
本章小結 160
課後習題 160
第8章服務器端渲染 162
教學導航 162
8.1 初識服務器端渲染 162
8.1.1 客戶端渲染與服務器端渲染的區別 162
8.1.2 服務器端渲染的注意事項 163
8.2 服務器端渲染的簡單實現 164
8.2.1 創建vue-ssr項目 164
8.2.2 渲染Vue實例 164
8.2.3 Express搭建SSR 165
8.2.4 Koa搭建SSR 166
8.3 webpack搭建服務器端渲染 167
8.3.1 基本流程 167
8.3.2 項目搭建 168
8.4 Nuxt.js服務器端渲染框架 172
8.4.1 創建Nuxt.js項目 172
8.4.2 頁面和路由 173
8.4.3 頁面跳轉 174
本章小結 174
課後習題 175
第9章“微商城”項目 176
教學導航 176
9.1 開發前準備 176
9.1.1 項目展示 176
9.1.2 技術方案 179
9.1.3 項目開發流程 180
9.2 項目搭建 180
9.2.1 創建項目 180
9.2.2 配置路由 181
9.2.3 配置Vuex 181
9.2.4 配置axios 182
9.2.5 目錄結構 182
9.3 商城首頁 182
9.3.1 頁面結構 183
9.3.2 頂部標題欄 183
9.3.3 輪播圖 185
9.3.4 九宮格展示區域 187
9.3.5 底部導航欄 187
9.4 新聞資訊 188
9.4.1 新聞資訊列表 188
9.4.2 新聞詳情 189
9.5 圖片分享 189
9.5.1 圖片列表 190
9.5.2 圖片詳情 190
9.6 商品購買 192
9.6.1 商品詳情頁 192
9.6.2 購物車 194
9.7 分類列表 196
9.7.1 頁面結構搭建 196
9.7.2 better-scroll的運用 197
本章小結 197
課後習題 197

本書是一本入門教材，以通俗易懂的語言、豐富實用的案例，詳細講解Vue.js的開發技術。全書共9章。第1章講解Vue.js的基本概念和開發環境；第2、3章講解Vue.js的開發基礎；第4章講解過渡和動畫的實現方式與應用；第5、6章講解Vue路由（vue-router）和Vuex狀態管理；第7章講解Vue.js開發環境的詳細配置；第8章講解服務器端渲染的理論與實踐；第9章講解“微商城”項目的開發實戰。本書既可作為高等院校計算機相關專業的Web前端開發課程的教材，也可作為廣大IT技術人員和編程愛好者的參考讀物。