Vue例項和生命週期
阿新 • • 發佈:2018-11-03
建立一個Vue例項
每個Vue應用都是通過Vue函式建立一個新的Vue例項開始:
var vm = new Vue({
//選項
})
資料與方法
當一個Vue例項被建立時,它向Vue的響應式系統中加入了其data物件中能找到的所有屬性。當這個屬性的值發生變化時,檢視將產生"響應",即匹配更新後的值。
//我們的資料物件 var data = {a: 1} //該資料物件加入到vue例項中 var vm = new Vue({ data: data }) //獲得這個例項上的屬性 //返回源資料中對應的欄位 vm.data == data.a // => true //設定屬性也會影響 vm.a = 2 data.a //2
值得注意的是只有當例項被建立時data中存在的屬性才是響應式的。
除了資料屬性,Vue例項還暴露一些有用的例項屬性和方法,他們都有$字首,以便與使用者定義的屬性區分開來。
var data = {a: 1} var vm = new Vue({ el: '#example', data: data }) vm.$data === data // true vm.$el === document.getElementById('example') // true vm.$watch('a', function(newValue, oldValue){ //這個回撥將在vm.a改變後呼叫 })
例項生命週期鉤子
created()可以用來在一個例項被建立之後執行程式碼。
生命週期鉤子的this上下文指向呼叫它的Vue例項。
關於生命週期的可以接我另外一篇文章:https://segmentfault.com/a/11...