最簡單的整合框架：Vue.js立即成為前端高手

在撰寫Vue文件的過程中，出於篇幅和精力的限制，主要著力於對Vue本身API的解釋。對缺乏實戰經驗的讀者來說，雖然可能明白了API的用法，但對於如何將它使用在實際專案中仍然會感到困惑。而這本書的優點，正是在於對重要的基礎知識結合了一些實戰範例來幫助讀者更進一步地了解API設計的初衷和使用場景，並且在GitHub有對應的原始程式可以下載研究。本書的作者梁灝是優秀的開放原始碼Vue元件函數庫iView的作者，也為Vue社區的活躍做出了很多貢獻。同時，對開放原始碼的投入，也使得他對Vue的設計和底層實現有相當深入的了解。

如果你喜歡透過實例來學習，那麼這本書會是你上手Vue的好選擇。

尤雨溪

2017年6月

在撰寫Vue文件的過程中，出於篇幅和精力的限制，主要著力於對Vue本身API的解釋。對缺乏實戰經驗的讀者來說，雖然可能明白了API的用法，但對於如何將它使用在實際專案中仍然會感到困惑。而這本書的優點，正是在於對重要的基礎知識結合了一些實戰範例來幫助讀者更進一步地了解API設計的初衷和使用場景，並且在GitHub有對應的原始程式可以下載研究。本書的作者梁灝是優秀的開放原始碼Vue元件函數庫iView的作者，也為Vue社區的活躍做出了很多貢獻。同時，對開放原始碼的投入，也使得他對Vue的設計和底層實現有相當深入的了解。

如果你喜歡透過...

前言

兩年前，我開始接觸Vue.js架構，當時就被它的輕量、元件化和人性化的API所吸引。之後我將Vue.js和webpack技術堆疊引用我的公司（TalkingData）視覺化團隊，並經過一年多的實作，現已成為整個公司的前端開發標準。

與此同時，我開放原始碼了iView專案，它是以Vue.js為基礎的一套高品質UI元件函數庫，從設計標準、專案建置到國際化都提供了完整的解決方案，並支援SSR。在許多志願者的幫助下，將文件全部翻譯為英文，在Vue開發者社區頗受歡迎。

如今，前端架構可謂百家爭鳴，但每一個架構的產生都是為了解決實際問題的。Vue.js以漸進式切入，對不同階段的開發者提供了不同的開發模式，由淺入深。Vue.js提供了人性化的API和強大的功能，包含雙向資料綁定、路由、狀態管理、動畫、元件化、SSR，無論是簡單的頁面還是複雜的系統，從可重複使用性、便捷性和維護性上都精益求精。

有幸完成此書，希望能給Vue.js社區帶來一點幫助。

梁灝（Aresn）

前言

兩年前，我開始接觸Vue.js架構，當時就被它的輕量、元件化和人性化的API所吸引。之後我將Vue.js和webpack技術堆疊引用我的公司（TalkingData）視覺化團隊，並經過一年多的實作，現已成為整個公司的前端開發標準。

與此同時，我開放原始碼了iView專案，它是以Vue.js為基礎的一套高品質UI元件函數庫，從設計標準、專案建置到國際化都提供了完整的解決方案，並支援SSR。在許多志願者的幫助下，將文件全部翻譯為英文，在Vue開發者社區頗受歡迎。

如今，前端架構可謂百家爭鳴，但每一個架構的產生都是為了解決實際問題的。Vue.js以漸進...

第一篇 基礎篇
CH 01 初識Vue.js
1.1 Vue.js是什麼
1.2 如何使用Vue.js
CH 02 資料綁定和第一個Vue應用
2.1 Vue實例與資料綁定
2.2 指令與事件
2.3 語法糖
CH 03 計算屬性
3.1 什麼是計算屬性
3.2 計算屬性用法
3.3 計算屬性快取
CH 04 v-bind及class與style綁定
4.1 了解v-bind指令
4.2 綁定class的幾種方式
4.3 綁定內聯樣式
CH 05 內置指令
5.1 基本指令
5.2 條件繪製指令
5.3 清單繪製指令v-for
5.4 方法與事件
5.5 實戰：利用計算屬性、指令等知識開發購物車
CH 06 表單與v-model
6.1 基本用法
6.2 綁定值
6.3 修飾符號
CH 07 元件詳解
7.1 元件與重複使用
7.2 使用props傳遞資料
7.3 元件通訊
7.4 使用slot分發內容
7.5 元件進階用法
7.6 其他
7.7 實戰：兩個常用元件的開發
CH 08 自訂指令
8.1 基本用法
8.2 實戰

第二篇 進階篇
CH 09 Render函數
9.1 什麼是Virtual Dom
9.2 什麼是Render函數
9.3 createElement用法
9.4 函數化元件
9.5 JSX
9.6 實戰：使用Render函數開發可排序的表格元件
9.7 實戰：留言清單
9.8 總結
CH 10 使用webpack
10.1 前端專案化與webpack
10.2 webpack基礎設定
10.3 單檔案元件與vue-loader
10.4 用於生產環境
CH 11 外掛程式
11.1 前端路由與vue-router
11.2 狀態管理與Vuex
11.3 實戰：中央事件匯流排外掛程式vue-bus

第三篇 實戰篇
CH 12 iView經典元件剖析
12.1 串聯選擇元件Cascader
12.2 折疊面板元件Collapse
12.3 iView內建工具函數
CH 13 實戰：知乎日報專案開發
13.1 分析與準備
13.2 推薦清單與分類
13.3 文章詳情頁
13.4 總結
CH 14 實戰：電子商務網站專案開發
14.1 開發專案架設
14.2 商品清單頁
14.3 商品詳情頁
14.4 購物車
14.5 總結
CH 15 相關開放原始碼專案介紹
15.1 服務端繪製與Nuxt.js
15.2 HTTP函數庫axios
15.3 多語言外掛程式vue-i18n

第一篇 基礎篇
CH 01 初識Vue.js
1.1 Vue.js是什麼
1.2 如何使用Vue.js
CH 02 資料綁定和第一個Vue應用
2.1 Vue實例與資料綁定
2.2 指令與事件
2.3 語法糖
CH 03 計算屬性
3.1 什麼是計算屬性
3.2 計算屬性用法
3.3 計算屬性快取
CH 04 v-bind及class與style綁定
4.1 了解v-bind指令
4.2 綁定class的幾種方式
4.3 綁定內聯樣式
CH 05 內置指令
5.1 基本指令
5.2 條件繪製指令
5.3 清單繪製指令v-for
5.4 方法與事件
5.5 實戰：利用計算屬性、指令等知識開發購物車
CH 06 表單與v-model
6.1 基本用法
6.2 綁定值
...