VueJS簡介


VueJS是一個開源的漸進式JavaScript框架,用於開發互動式Web介面。它是用於簡化Web開發的著名框架之一,VueJS專注於檢視層。它可以很容易地整合到大型專案前端開發沒有任何問題。

VueJS的安裝非常容易。 任何開發人員都可以在短時間內輕鬆理解和構建互動式Web介面。 VueJS由Google的前員工Evan You 建立。VueJS的第一個版本是在2014年2月發布的。它最近在GitHub上有64,828顆星,因此非常受歡迎。

特徵

以下是VueJS提供的功能。

1. 虛擬DOM

VueJS使用了虛擬DOM,這個虛擬DOM也被React,Ember等其他框架所使用。這個改變不是在DOM上進行的,而是建立了一個以JavaScript資料結構形式存在的DOM副本。 每當進行任何更改時,都會對JavaScript資料結構進行更改,並將後者與原始資料結構進行比較。 然後,最終的更改將更新為真實的DOM,使用者將看到這種變化。 這在優化方面是很好的,它比較容易,可以以更快的速度進行改變。

2. 資料系結

資料系結功能可以幫助操縱或分配HTML屬性的值,改變樣式,通過VueJS提供的稱為v-bind的系結指令來分配類。

3. 元件

元件是VueJS的重要功能之一,可以幫助建立可以在HTML中重用的自定義元素。

4. 事件處理

v-on是新增到DOM元素以監聽VueJS中的事件的屬性。

5. 動畫/過渡

VueJS提供了多種方式來在向DOM元素新增/更新或刪除HTML元素時應用轉換。 VueJS有一個內建的轉換元件,需要將其包裝在元素中以獲得轉換效果。 我們可以輕鬆地新增第三方動畫庫,也可以為介面新增更多的互動性。

6. 計算屬性

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

7. 模板

VueJS提供基於HTML的模板,將DOM與Vue範例資料系結。Vue將模板編譯為虛擬DOM渲染功能。 我們可以使用渲染函式的模板,這樣必須用渲染函式替換模板。

8. 指令

VueJS有內建的指令,例如:v-ifv-elsev-showv-onv-bindv-model,這些指令用於在前端執行各種操作。

9. 觀察者

觀察者(Watcher)被應用於改變的資料。 例如,表單輸入元素。 在這裡不必新增任何額外的事件。 觀察者負責處理任何資料更改,使程式碼簡單快捷。

10. 路由

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

11. 輕量級

VueJS指令碼非常輕便,效能也非常快。

12. Vue公司-CLI

可以使用vue-cli命令列介面在命令列安裝VueJS。 這有助於使用vue-cli輕鬆構建和編譯專案。