Vue.js 是什麼？

vue應用指令碼部分

指令碼部分會包裹在指令碼標籤之中，當引入vue。js之後會在dom中宣告全域性變數Vue，透過new Vue的方式可以或的Vue的應用，它會返回一個物件，如下程式碼中的var app。在new Vue的時候需要傳遞一個物件作為引數，這個物件有兩個中要的屬性，一個是el（element：元素），我們利用id選擇器的方式，選中試圖部分的div，另一個屬性是data，data用與儲存資料，我們在試圖中宣告的變數（message、sitename）就要在data中註冊，並初始化變數的值。

var vm =newVue（{

el：‘#app’，

data：{

message：‘Hello Vue！’，

sitename：‘程式設計之吧’，

}

}）；

以上就是建立的一個 Vue 簡單應用！當我們 new Vue 的時候， Vue 其實做了大量工作，現在資料和 DOM 已經被建立了關聯，所有東西都是響應式的。我們要怎麼確認呢？

開啟你的瀏覽器的JavaScript控制檯（就在這個頁面開啟），並修改app。message的值，你將看到上例相應地更新。

更新前：

更新後：

注意我們不再和 HTML 直接互動了。一個 Vue 應用會將其掛載到一個 DOM 元素上 （對於這個例子是 #vm） 然後對其進行完全控制。那個 HTML 是我們的入口，但其餘都會發生在新建立的 Vue 例項內部。

除了文字插值，我們還可以像這樣來繫結元素 attribute：

<！DOCTYPE html>

{{ message }}

{{ sitename }}

滑鼠懸停在此，將會顯示：{{ message }}！