vue實例

1.構造器

1.1.每個 Vue.js 應用都是通過構造函數?Vue?創建一個?Vue 的根實例?啟動的：

1.2.在實例化 Vue 時，需要傳入一個選項對象，它可以包含數據、模板、掛載元素、方法、生命周期鉤子等選項。

1.3.可以擴展?Vue?構造器，從而用預定義選項創建可復用的組件構造器

　var MyConponent = Vue.extends({})　

1.4.所有的 Vue.js 組件其實都是被擴展的 Vue 實例

2.屬性

2.1每個 Vue 實例都會代理其?data?對象里所有的屬性：

var data = { a: 1 }

var vm = new Vue({

data: data

})

vm.a === data.a // -> true

vm.a = 2

data.a // -> 2

data.a=3

vm.a=3//->

2.2.除了 data 屬性， Vue 實例暴露了一些有用的實例屬性與方法。這些屬性與方法都有前綴?$，以便與代理的 data 屬性區分。例如：

vm.$data === data // -> true

vm.$el === document.getElementById('example') // -> true

2.3.vm.$watch('a',?function (newVal, oldVal) {//這就是臟檢查，通過比較前后新值和舊值的結果是否改變，如果改變就修改view

// 這個回調將在 `vm.a` 改變后調用

})

3.生命周期:每個 Vue 實例在被創建之前都要經過一系列的初始化過程。

例如，實例需要配置數據觀測(data observer)、編譯模版、掛載實例到 DOM ，然后在數據變化時更新 DOM 。在這個過程中，實例也會調用一些?生命周期鉤子?，這就給我們提供了執行自定義邏輯的機會

var vm = new Vue({

　　data: {a: 1},

　　created: function () {console.log('a is: ' + this.a)}

})

4.也有一些其它的鉤子，在實例生命周期的不同階段調用，如?mounted、?updated?、destroyed?。鉤子的?this?指向調用它的 Vue 實例。

5.生命周期：

5.1.new vue（）

5.2.data observer();//數據觀測

5.3init event();//編譯模板

5.4.掛載實例到模板

5.5.。。。

?

?總結：

1.構造器

?構造器的結構、擴展

2.屬性

?vue對data屬性的指代

data對data屬性的指代

3.vue生命周期

?生命周期流程、生命周期函數