Vue (讀音 /vjuː/，類似於 view) 是一套用於構建使用者介面的漸進式框架。與其它大型框架不同的是，Vue 被設計為可以自底向上逐層應用。Vue 的核心庫只關注檢視層，不僅易於上手，還便於與第三方庫或既有專案整合。另一方面，當與現代化的工具鏈以及各種支援類庫結合使用時，Vue 也完全能夠為複雜的單頁應用提供驅動。
宣告例項
new Vue({
el:", 繫結作用域
data：放資料
methods:事件函式
computed:計算屬性
生命週期
beforeCreate:{}
})
methods 和 data中的變數不能重複
指令
用之前需要先宣告 例項
v-text 相當於 innerText
v-html 相當於 innerHTML 注意：內容按普通 HTML 插入 – 不會作為 Vue 模板進行編譯 。
v-for 迴圈
我們用 v-for 指令根據一組陣列的選項列表進行渲染。
<p v-for="(item,$index) in arr"></p> <p v-for="(item,$key,$index) in arr"></p>
item:屬性值 $key:屬性名 $index:索引值
v-for 指令需要使用 item in items 形式的特殊語法，arr是源資料陣列並且 item 是陣列元素迭代的別名。
v-on 繫結 語法糖縮寫：@
<button v-on:click="btn" ></button> <!--縮寫--> <button @click="btn" ></button>
v-show 顯示/隱藏
根據表示式之真假值，切換元素的 display CSS 屬性。當條件變化時該指令觸發過渡效果。
v-show = true/false
v-if/v-if-else/v-else-if判斷
前一兄弟元素必須有 v-if 或 v-else-if
<div v-if="type === `A`">
A
</div>
<div v-else-if="type === `B`">
B
</div>
<div v-else-if="type === `C`">
C
</div>
v-if和v-show區別
v-if是動態的向DOM樹內新增或者刪除DOM元素；
v-show是通過設定DOM元素的display樣式屬性控制顯隱；
v-if 只會載入真的部分 有快取 消耗高 適合偶爾的顯示隱藏切換
v-show 都會載入 沒有快取 消耗相對低 適合頻繁的切換
v-model 雙向繫結 和表單配合使用
下拉框 value>text
v-bind 屬性繫結 動態地繫結一個或多個特性，或一個元件 prop 到表示式。
v-bind:class 語法糖縮寫 :class
<p :style=[color,size]> 繫結多個屬性用陣列方法