金剛狼系列電影是個人比較喜愛的超級英雄，金剛狼是 Xmen 中的一員，也是 Xmen 中唯一一個有自己單體電影一個超級英雄吧。我們不確定呀。不過金剛狼和Xmen的關係有點像 jquery 和 javascript 當年關係，當年 jquery 有蓋過 javascript 的趨勢。不過隨着 javascript 自身不多完善，以及前段不斷髮展，技術上進行翻天覆地的改變，jquery 這個昔日此詫風雲也淡淡退出 developer 視野，我們更多地關心像 angular react 和 Vue 這樣新興的英雄。
那麼一些老的項目，如果用jquery寫的，就面臨向 vue 進行升級。今天我們就看一看如何把 jquery 項目轉移爲 vue 項目。在開始之間我們看一看 jquery 和 vue 歷史以及他們開發 web 的不同套路吧。首先我們看 jquery 是事件驅動的，而 vue 是數據驅動的。
大小上，vue 顯得輕巧而且強大。
安裝差別不大，不過 vue 當然不僅是這麼簡單，我們可以通過 vue 和 webpack 以及 vue 周邊以及衍生產品搭建出龐大複雜的庫，不過 vue 是大事能做小事也不差，我們可以簡單引用 vue 就可以開始進行 vue 開發之旅了。
我們通過一些常用 web 開發場景來對比 vue 和 jquery 對應開發套路，從而大家可以瞭解一下如何將你的 jquery 代碼轉換爲 vue 的代碼。下面是點擊事件的處理。jquery 是通過選擇器獲取 dom 然後將事件綁定到 dom 上，而 vue 是通過 @click 自定義 dom 屬性將點擊事件綁定到對應 dom 上的。
樣式的綁定，只要是綁定一定像 vue 這樣 moden web 框架的優勢，通過自定義:class 屬性就輕鬆將 className 的樣式賦給我們目標的 dom。
數據綁定最初是 angular 引入的吧，視乎一下只讓 web 前端從繁重數據綁定的工作解放出來。我們可以把更多精力放在業務邏輯上了。
通過對比我們看在 vue 上實現數據綁定是多麼簡單，而且 code 邏輯更加清晰易懂。v-model 和 {{}} 就把數據和視圖建立起關係了。
