vue 實(shí)例
var vm = new Vue({
el:"#app",
data: {
a: 1
},
created: function () {
// `this` 指向 vm 實(shí)例
console.log('a is: ' + this.a)
}
})
// -> "a is: 1"
vue 生成一個(gè)實(shí)例，實(shí)例里面有很多的屬性，然后把實(shí)例渲染到頁(yè)面上去；
做個(gè)比喻，vue 是一個(gè)家族，世世代代每個(gè)成員（實(shí)例）都要上戰(zhàn)場(chǎng)（渲染到DOM上），家族里出來(lái)的每個(gè)人（實(shí)例），都有自己的參數(shù)
- 實(shí)例名稱：
vm - 掛載點(diǎn)：
el - 數(shù)據(jù)：
data - 方法：
methods - 生命周期：下圖的函數(shù)
生命周期
vue 家族里出來(lái)的每個(gè)人，從出生到上戰(zhàn)場(chǎng)，到死亡，它會(huì)經(jīng)歷一系列的過(guò)程，如下圖所示
image.png
一個(gè)人（實(shí)例），在它的一生中，會(huì)有幾個(gè)重要的時(shí)間節(jié)點(diǎn)，每個(gè)節(jié)點(diǎn)稱為聲明周期鉤子函數(shù)，依次是：
-
beforeCreate：這個(gè)實(shí)例還沒(méi)有創(chuàng)造出來(lái)，無(wú)法獲取data、methods，可以理解為，這個(gè)人還沒(méi)生出來(lái)。 -
created：這個(gè)實(shí)例被創(chuàng)造出來(lái)了,可以獲取data、methods，可以理解為，這個(gè)人已經(jīng)存在了。 -
beforeMount：掛載之前，實(shí)例剛剛渲染到 DOM 節(jié)點(diǎn)上，相關(guān)渲染函數(shù)剛執(zhí)行。可以理解為，這個(gè)人到兵營(yíng)去報(bào)了個(gè)到，其他啥都沒(méi)干。 -
mounted：掛載之后，實(shí)例的初始數(shù)據(jù)data在 DOM 上已經(jīng)渲染完畢，注意：如果是異步的數(shù)據(jù)，這時(shí)候還沒(méi)渲染。 -
beforeUpdate：實(shí)例的data如果發(fā)生變化，beforeUpdate這個(gè)時(shí)候就是指在變化之前。 -
updated：實(shí)例的data變化完畢，異步數(shù)據(jù)也全部獲取。 -
beforeDestory：實(shí)例銷毀前。 -
destoryed：實(shí)例銷毀完畢
updated、watch、$nextTick 異同：
相同點(diǎn)，都是數(shù)據(jù)發(fā)生變化后的鉤子函數(shù)
不同：
- update：所有數(shù)據(jù)的所有變化，如果做同一個(gè)的業(yè)務(wù)邏輯處理，在這里；
- watch：監(jiān)聽(tīng)具體數(shù)據(jù)的變化，并做相應(yīng)處理。
- $nextTick： 某個(gè)數(shù)據(jù)的某個(gè)變化，變化后立即更新DOM；
