什(shén)麽是 Vue？

Vue (發音(yīn)爲 /vjuː/，類似 view) 是一款用(yòng)于構建用(yòng)戶界面的 JavaScript 框架。它基于标準 HTML、CSS 和(hé) JavaScript 構建，并提供了(le)一套聲明(míng)式的、組件化的編程模型，幫助你(nǐ)高(gāo)效地開(kāi)發用(yòng)戶界面。無論是簡單還是複雜(zá)的界面，Vue 都可以勝任。

聲明(míng)式渲染：Vue 基于标準 HTML 拓展了(le)一套模闆語法，使得我們可以聲明(míng)式地描述最終輸出的 HTML 和(hé) JavaScript 狀态之間的關系。

響應性：Vue 會(huì)自(zì)動跟蹤 JavaScript 狀态并在其發生變化時(shí)響應式地更新 DOM。

你(nǐ)可能(néng)已經有了(le)些(xiē)疑問——先别急，在後續的文(wén)檔中我們會(huì)詳細介紹每一個細節。現(xiàn)在，請(qǐng)繼續看(kàn)下(xià)去，以确保你(nǐ)對(duì) Vue 作(zuò)爲一個框架到(dào)底提供了(le)什(shén)麽有一個宏觀的了(le)解。

漸進式框架 ​

Vue 是一個框架，也(yě)是一個生态。其功能(néng)覆蓋了(le)大(dà)部分前端開(kāi)發常見的需求。但(dàn) Web 世界是十分多樣化的，不同的開(kāi)發者在 Web 上(shàng)構建的東西可能(néng)在形式和(hé)規模上(shàng)會(huì)有很(hěn)大(dà)的不同。考慮到(dào)這(zhè)一點，Vue 的設計(jì)非常注重靈活性和(hé)“可以被逐步集成”這(zhè)個特點。根據你(nǐ)的需求場景，你(nǐ)可以用(yòng)不同的方式使用(yòng) Vue：

無需構建步驟，漸進式增強靜态的 HTML

在任何頁面中作(zuò)爲 Web Components 嵌入

單頁應用(yòng) (SPA)

全棧 / 服務端渲染 (SSR)

Jamstack / 靜态站(zhàn)點生成 (SSG)

開(kāi)發桌面端、移動端、WebGL，甚至是命令行終端中的界面

如果你(nǐ)是初學者，可能(néng)會(huì)覺得這(zhè)些(xiē)概念有些(xiē)複雜(zá)。别擔心！理(lǐ)解教程和(hé)指南的内容隻需要具備基礎的 HTML 和(hé) JavaScript 知(zhī)識。即使你(nǐ)不是這(zhè)些(xiē)方面的專家，也(yě)能(néng)夠跟得上(shàng)。

如果你(nǐ)是有經驗的開(kāi)發者，希望了(le)解如何以最合适的方式在項目中引入 Vue，或者是對(duì)上(shàng)述的這(zhè)些(xiē)概念感到(dào)好(hǎo)奇，我們在使用(yòng) Vue 的多種方式中讨論了(le)有關它們的更多細節。

無論再怎麽靈活，Vue 的核心知(zhī)識在所有這(zhè)些(xiē)用(yòng)例中都是通用(yòng)的。即使你(nǐ)現(xiàn)在隻是一個初學者，随着你(nǐ)的不斷成長，到(dào)未來(lái)有能(néng)力實現(xiàn)更複雜(zá)的項目時(shí)，這(zhè)一路上(shàng)獲得的知(zhī)識依然會(huì)适用(yòng)。如果你(nǐ)已經是一個老(lǎo)手，你(nǐ)可以根據實際場景來(lái)選擇使用(yòng) Vue 的最佳方式，在各種場景下(xià)都可以保持同樣的開(kāi)發效率。這(zhè)就是爲什(shén)麽我們将 Vue 稱爲“漸進式框架”：它是一個可以與你(nǐ)共同成長、适應你(nǐ)不同需求的框架。

單文(wén)件組件 ​

在大(dà)多數啓用(yòng)了(le)構建工(gōng)具的 Vue 項目中，我們可以使用(yòng)一種類似 HTML 格式的文(wén)件來(lái)書寫 Vue 組件，它被稱爲單文(wén)件組件 (也(yě)被稱爲 *.vue 文(wén)件，英文(wén) Single-File Components，縮寫爲 SFC)。顧名思義，Vue 的單文(wén)件組件會(huì)将一個組件的邏輯 (JavaScript)，模闆 (HTML) 和(hé)樣式 (CSS) 封裝在同一個文(wén)件裏。

單文(wén)件組件是 Vue 的标志性功能(néng)。如果你(nǐ)的用(yòng)例需要進行構建，我們推薦用(yòng)它來(lái)編寫 Vue 組件。你(nǐ)可以在後續相關章節裏了(le)解更多關于單文(wén)件組件的用(yòng)法及用(yòng)途。但(dàn)你(nǐ)暫時(shí)隻需要知(zhī)道(dào) Vue 會(huì)幫忙處理(lǐ)所有這(zhè)些(xiē)構建工(gōng)具的配置就好(hǎo)。

API 風(fēng)格 ​

Vue 的組件可以按兩種不同的風(fēng)格書寫：選項式 API 和(hé)組合式 API。

選項式 API (Options API) ​

使用(yòng)選項式 API，我們可以用(yòng)包含多個選項的對(duì)象來(lái)描述組件的邏輯，例如 data、methods 和(hé) mounted。選項所定義的屬性都會(huì)暴露在函數内部的 this 上(shàng)，它會(huì)指向當前的組件實例。

組合式 API (Composition API) ​