1. 為什麼學習Vue框架
vue框架算是最近前端開發很好的工具。可以突破以前所沒有實時更新頁面。很有發展前景，很多大公司現在正在使用。
Vue框架誕生於2014年，其作者為中國人——尤雨溪，也是新人最容易入手的框架之一，不同於React和Angular,其中文文檔也便於大家閱讀和學習。Vue用於構建互動式的Web界面的庫，是一個構建數據驅動的Web界面漸進式框架，該框架遵循CMD規范，並且提供的設計模式為MVVM模式（Model->View->View-Model）和一個可組合的組合型組件系統，具有簡單的、靈活的API(介面)。該框架繼承了React的虛擬DOM技術和Angular的雙向數據綁定技術，是一款較新的功能性框架。
在這里介紹下什麼是虛擬DOM和雙向數據綁定：
1、虛擬DOM（Virtual DOM），顧名思義，從字面上理解就是虛構的DOM樹，當我們用傳統的原生API或者jQuery去操作DOM時，瀏覽器會從構建DOM樹開始從頭到尾執行一遍流程。即使計算機硬體一直在更新迭代，但是操作真實DOM的代價仍舊很昂貴，真實的DOM節點，哪怕是一個最簡單的div也包含很多屬性，所以頻繁的操作，會導致頁面卡頓，影響用戶的體驗。為了解決這個瀏覽器性能問題，虛擬DOM（Virtual DOM）就被設計出來了，其核心演算法是Diff演算法。它會將一次操作過程中對真實DOM所有更新的diff內容保存到本地的一個js對象中，最終將這個js對象一次性attach到DOM樹上，通知瀏覽器去執行繪制工作，避免了大量的無謂的計算量。
用js對象模擬DOM節點的好處是：頁面的更新可以先全部反應在js對象上，操作內存中的js對象的速度明顯要快的多。等更新完成後，在將最終的js對象映射成真實的DOM，交由瀏覽器去繪制。（提高了性能，並且運行速度快）
2、雙向數據綁定，在講雙向數據綁定前，我們要想說下單向數據綁定，單向數據綁定，就是把Model綁定到View上，當我們用JavaScript代碼更新Model時，View就會自動更新了（Model-->View）。那麼雙向數據綁定就是，用戶更新了View，Model的數據也會自動被更新（Model<-->View）。什麼情況下用戶可以更新View呢？舉個最直接的例子，填寫表單，當用戶填寫表單時，View的狀態就被更新了，如果此時MVVM框架可以自動更新Model的狀態，那麼就相當於我們把Model和View做了雙向數據綁定。其原理是我們要對input進行value 的屬性綁定（v-bind：value=」...」）將Model中的變數綁定到View上（Model->View）以及當用戶對input進行操作時，進行事件監聽（v-on：input=」...」）將View上的更新傳回Model中（View->Model）從而實現雙向數據綁定，在Vue中，以上操作過於繁瑣，便提供了v-model直接實現雙向數據綁定的效果。
在進行Vue項目開發過程中，我們可以通過script標簽引入式寫法來引入vue或者是nodejs自帶的包管理工具npm安裝vue。並且通過new Vue（）進行新建一個Vue的實例對象，其下有很多屬性，包括el、data、methods、computed、watch等等，el為指向頁面的節點元素，data存儲數據，數據類型包括simple datatype（簡單數據類型）以及complex datatype（復雜數據類型），用插值表達式{{}}顯示，在插值顯示的時候，不需要寫上data，methods內存儲方法，通過fn（）的形式調用方法，computed內存儲也是方法，但是其為計算數據，復雜邏輯的應該存儲在computed中，計算屬性是基於它們的依賴進行緩存的，由於computed帶有一層緩存，所以只有在它的相關依賴發生改變時才會重新運行，而methods則是調用一次生成一次，computed中的方法調用時不需要加（）的，watch為監聽，監控，監聽data中的屬性值也可以監控對象，存在兩個參數（currentValue當前值和prevValue之前值）。