1.鉤子函數(shù)
創(chuàng)建前后
beforecreate:
在實(shí)例初始化之后
這個(gè)階段的data岛宦,methods寝受,computed以及watch的數(shù)據(jù)和方法不能被訪問
created:
在實(shí)例創(chuàng)建完成后被立即調(diào)用此時(shí)data 和 methods已經(jīng)可以使用 但是頁面還沒有渲染出來
掛載前后
beforeMount:
發(fā)生在頁面渲染之前昭灵,當(dāng)前階段虛擬Dom已經(jīng)創(chuàng)建完成青抛,即將開始渲染舍杜。
在此時(shí)也可以對(duì)數(shù)據(jù)進(jìn)行更改,不會(huì)觸發(fā)updated。
mounted:
el被新創(chuàng)建的vm.$el替換蘸泻,并掛載到實(shí)例上去之后調(diào)用該鉤子瞻佛。 數(shù)據(jù)已經(jīng)真實(shí)渲染到頁面上 在這個(gè)鉤子函數(shù)里面我們可以使用一些第三方的插件
更新前后
beforeUpdate:
發(fā)生在更新之前脱篙,也就是響應(yīng)式數(shù)據(jù)發(fā)生更新,虛擬dom重新渲染之前被觸發(fā)伤柄,
你可以在當(dāng)前階段進(jìn)行更改數(shù)據(jù)绊困,不會(huì)造成重渲染。
updated:
發(fā)生在更新完成之后适刀,當(dāng)前階段組件Dom已完成更新秤朗。
要注意的是避免在此期間更改數(shù)據(jù),因?yàn)檫@可能會(huì)導(dǎo)致無限循環(huán)的更新笔喉。
銷毀前后
beforeDestroy:
發(fā)生在實(shí)例銷毀之前取视,在當(dāng)前階段實(shí)例完全可以被使用,
我們可以在這時(shí)進(jìn)行善后收尾工作常挚,比如清除計(jì)時(shí)器
destroyed:
發(fā)生在實(shí)例銷毀之后作谭,這個(gè)時(shí)候只剩下了dom空殼。組件已被拆解奄毡,數(shù)據(jù)綁定被卸除折欠,監(jiān)聽被移出,子實(shí)例也統(tǒng)統(tǒng)被銷毀。
補(bǔ)充:
activated:
keep-alive專屬怨酝,組件被激活時(shí)調(diào)用
deactivated :
keep-alive專屬傀缩,組件被銷毀時(shí)調(diào)用
鉤子函數(shù)的使用方法
1.beforecreate: data 和 $el 都沒有初始化 全部為 undefined,
可以在加個(gè)loading事件农猬,在加載實(shí)例時(shí)觸發(fā) 赡艰,
2.created: 初始化完成時(shí)的事件寫在這里,如在這結(jié)束loading事件斤葱,異步請(qǐng)求也適宜在這里調(diào)用
3.mounted: 掛載元素慷垮,獲取到dom節(jié)點(diǎn)
4.beforeUpdate 可以在這個(gè)鉤子中進(jìn)一步地更改狀態(tài),這不會(huì)觸發(fā)附加的重渲染過程揍堕。
5.updated: 可以執(zhí)行依賴于 DOM 的操作料身。然而在大多數(shù)情況下,你應(yīng)該避免在此期間更改狀態(tài)衩茸,
因?yàn)檫@可能會(huì)導(dǎo)致更新無限循環(huán)芹血。 該鉤子在服務(wù)器端渲染期間不被調(diào)用。
6.beforeDestroy : 可以做一個(gè)確認(rèn)停止事件的確認(rèn)框
7.destroyed 可以執(zhí)行一些優(yōu)化操作,清空定時(shí)器楞慈,解除綁定事件
最后編輯于 :
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者