目錄
實例
//批注:一個應(yīng)用一個實例
var vm = new Vue({
// 選項
})
選項對象
數(shù)據(jù)對象
//數(shù)據(jù)對象
var data = { a: 1 }
// 該對象被加入到一個 Vue 實例中
var vm = new Vue({
data: data
})
創(chuàng)建
var data = { a: 1 }
注入
var vm = new Vue({
data: data
})
修改(不推薦)
vm.a = "hello"
凍結(jié)
Object.freeze(data)
屬性暴露
Vue 實例還暴露了一些有用的實例屬性與方法齐莲。它們都有前綴 $口芍,以便與用戶定義的屬性區(qū)分開來.
生命周期
過程
設(shè)置數(shù)據(jù)監(jiān)聽但壮、編譯模板、將實例掛載到 DOM 并在數(shù)據(jù)變化時更新 DOM 等
鉤子
給用戶在不同階段添加自己的代碼的機會
創(chuàng)建階段
new Vue({
data: {
a: 1
},
created: function () {
// `this` 指向 vm 實例
console.log('a is: ' + this.a)
}
})
觸發(fā)階段
更新階段
銷毀階段
箭頭函數(shù)
不要在選項屬性或回調(diào)上使用箭頭函數(shù),因為箭頭函數(shù)是和父級上下文綁定在一起的癌别,this 不會是如你所預期的 Vue 實例.
圖示
組件系統(tǒng)