Vue介紹

VueJS是一個開源的漸進式JavaScript框架，用於開發交互式Web界面。它是用於簡化Web開發的著名框架之一。VueJS專注於視圖層。它可以很容易地集成到大型項目中進行前端開發而不會出現任何問題。

VueJS的安裝非常容易入手。任何開發人員都可以在一段時間內輕鬆理解和構建交互式Web界面。VueJS由來自Google的前僱員Evan You創建。VueJS的第一個版本於2014年2月發佈。它最近在GitHub上發佈了137989顆星，非常受歡迎。

為什麼我會寫這篇文章

不僅僅是這篇文章，後面會陸續的寫更多的關於Vue的文章，因為我沒學過，現在時從頭開始學，就當是記錄筆記，一步步的將Vue學會並能夠應用到項目開發中去，如果有人願意，可以共同交流學習。本篇內容先對Vue做一個簡單的介紹，包括了自己的一些理解！如有不同意見，歡迎評論留言！

Virtual DOM（虛擬DOM）

VueJS使用虛擬DOM，其他框架（如React，Ember等）也使用虛擬DOM。不會對DOM進行更改，而是創建以JavaScript數據結構形式存在的DOM副本。。無論何時進行任何更改，都將對JavaScript數據結構進行更改，並將後者與原始數據結構進行比較。然後將最終更改更新為真實DOM，用戶將看到更改。它在性能方面優化的非常好，而且更加簡單，總之就是更快和更強

數據綁定（Data Binding）

數據綁定功能有助於操作或賦值給HTML屬性，更改樣式，藉助VueJS提供的名為v-bind的綁定指令來分配

組件（Components）

組件是VueJS的重要功能之一，它有助於創建自定義元素，可以在HTML中重複使用，即組件複用

事件處理（Event Handling）

將v-on添加到DOM元素的屬性，用於監聽VueJS中的事件。

動畫/過渡（Animation/Transition）

VueJS提供了各種方法，可以在添加/更新或從DOM中刪除HTML元素時應用轉換。VueJS有一個內置的過渡組件，需要圍繞元素包裹以實現過渡效果。我們可以輕鬆添加第三方動畫庫，併為界面添加更多交互性。

計算屬性（Computed Properties）

這是VueJS的重要特徵之一。它有助於監聽對UI元素所做的更改並執行必要的計算。不需要額外的編碼。

模板（Templates）

VueJS提供基於HTML的模板，將DOM與Vue實例數據綁定在一起。Vue將模板編譯為虛擬DOM渲染函數。我們可以使用渲染函數的模板，為此我們必須用render函數替換模板。

指令（Directives）

VueJS具有內置指令，例如v-if，v-else，v-show，v-on，v-bind和v-model，它們用於在前端執行各種操作。

監視器（Watchers）

監視器應用於更改的數據。例如，表單輸入元素。在這裡，我們不必添加任何其他事件。Watcher負責處理任何數據更改，使代碼簡單快速。

路由（Routing）

頁面之間的導航是在vue-router的幫助下完成的。

輕量級（Lightweight）

VueJS腳本非常輕巧，性能也非常快。

Vue-CLI

可以使用vue-cli命令行界面在命令行安裝VueJS。使用vue-cli可以輕鬆地構建和編譯項目。

與其他框架的比較

這裡由於我之前只用過react，就簡單對比下

虛擬DOM

Virtual DOM是DOM樹的虛擬表示。使用虛擬DOM，可以創建一個與真實DOM相同的JavaScript對象。每當需要對DOM進行更改時，都會創建一個新的JavaScript對象並進行更改。稍後，將比較兩個JavaScript對象，並在真實DOM中更新最終更改。VueJS和React都使用虛擬DOM，這使得它更快。