建議學(xué)習(xí)時(shí)長(zhǎng)： 30分鐘
學(xué)習(xí)方式：了解

學(xué)習(xí)目標(biāo)

• 知道什么是 Vue.js
• 了解 Vue.js 的特點(diǎn)
• 能運(yùn)行 Hello World。

詳細(xì)介紹

Vue.js（讀音 /vju?/，類似于 view） 是一套構(gòu)建用戶界面的漸進(jìn)式框架。與其他重量級(jí)框架不同的是，Vue 采用自底向上增量開(kāi)發(fā)的設(shè)計(jì)。Vue 的核心庫(kù)只關(guān)注視圖層，它不僅易于上手，還便于與第三方庫(kù)或既有項(xiàng)目整合。另一方面，當(dāng)與單文件組件和 Vue 生態(tài)系統(tǒng)支持的庫(kù)結(jié)合使用時(shí)，Vue 也完全能夠?yàn)閺?fù)雜的單頁(yè)應(yīng)用程序提供驅(qū)動(dòng)。

Vue.js 和 jQuery 不同的是：如果要修改頁(yè)面的內(nèi)容，用 jQuery 的方式是直接選擇DOM，修改內(nèi)容；用 Vue.js 的方式是修改數(shù)據(jù)，Vue.js 會(huì)根據(jù)我們會(huì)寫好的數(shù)據(jù)與頁(yè)面內(nèi)容的關(guān)聯(lián)關(guān)系，Vue.js 自動(dòng)的更新頁(yè)面。

有中文官網(wǎng)和中文文檔(媽媽再也不擔(dān)心我英文不好)~

特點(diǎn)

• 易學(xué)，易用。API 簡(jiǎn)潔明了。
• 靈活。簡(jiǎn)單小巧的核心，漸進(jìn)式技術(shù)棧，足以應(yīng)付任何規(guī)模的應(yīng)用。
• 高效。20kb min+gzip 運(yùn)行大??；超快虛擬 DOM；最省心的優(yōu)化。

入門

1 引入 Vue.js 的腳本

<script src="https://unpkg.com/vue"></script>

2 HTML 中加如下內(nèi)容

<div id="app">
  {{ message }}
</div>
<script>
var app = new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue!'
  }
})
</script>

頁(yè)面輸出結(jié)果：Hello Vue!