概述
vue.js是一個構(gòu)建數(shù)據(jù)驅(qū)動的web界面的庫麻掸，通過簡單的api實現(xiàn) 響應(yīng)的數(shù)據(jù)綁定 和 組合的視覺組件
vue.js 的綁定視圖DOM的方法與 angualar.js 很相似
v-if 特性被稱作指令。指令帶有前綴 v- ，代表vue.js提供的特性互亮，它們會給綁定的目標添加響應(yīng)式的特殊行為。
組件的應(yīng)用模板
<div id = "app">
<app-nav></app-nav>
<app-view>
<app-sidebar></app-sidebar>
<app-content></app-content>
</app-view>
</div>構(gòu)造器
-
MVVM 模式
var vm = new Vue({ // MVVM模式中描述的ViewModel
//選項(數(shù)據(jù)、模板、掛載元素创坞、方法、生命周期鉤子)
}) - 創(chuàng)建可復(fù)用的組件構(gòu)造器
所有的Vue.js組件其實都是被擴展的vue實例
var Mycomponent = Vue.extend({
// 擴展選項
})
// 所有的 ‘Mycomponent’ 實例都將以預(yù)定義的擴展選項被創(chuàng)建
var myComponentInstance = new Mycomponent()
- 屬性與方法
- 代理數(shù)據(jù)屬性（響應(yīng)）
每個vue實例都會代理其 data 對象里的所有屬性
var data = { a : 1 }
var vm = new Vue ({
el: '#example'
data: data
})
vm.a === data.a // true - 實例屬性與方法（帶前綴 $）
vm.$data === data // true
vm.$el === document.getElementById('example') // true
// $watch 是一個方法
vm.$watch('a', function (newVal, oldVal) {
//這個回調(diào)將會在 'vm.a' 改變后調(diào)用
})
- 代理數(shù)據(jù)屬性（響應(yīng)）
- 實例生命周期
- vue.js沒有“控制器”的概念受葛，組件的自定義邏輯都是分割在各種生命周期鉤子上题涨，包括 compiled偎谁、ready、destroyed纲堵、creaded
生命周期圖示
