|
導讀網(wǎng)頁的本質就是超級文本標記語言,通過結合使用其他的Web技術(如:腳本語言、公共網(wǎng)關接口、組件等),可以創(chuàng)造出功能強大的網(wǎng)頁。因而,超級文本標記語言是萬維網(wǎng)(Web)編程的基礎,也就是說萬維網(wǎng)是建立... 網(wǎng)頁的本質就是超級文本標記語言,通過結合使用其他的Web技術(如:腳本語言、公共網(wǎng)關接口、組件等),可以創(chuàng)造出功能強大的網(wǎng)頁。因而,超級文本標記語言是萬維網(wǎng)(Web)編程的基礎,也就是說萬維網(wǎng)是建立在超文本基礎之上的。超級文本標記語言之所以稱為超文本標記語言,是因為文本中包含了所謂“超級鏈接”點。 本篇文章給大家?guī)淼膬热菔顷P于vue生命周期鉤子鉤子函數(shù)的介紹(附示例),有一定的參考價值,有需要的朋友可以參考一下,希望對你有所幫助。Vue實例的生命周期鉤子函數(shù)(8個) 1、beforeCreate 剛 new了一個組件,無法訪問到數(shù)據(jù)和真實的dom,基本上這個好像不能干啥 2、created data屬性完成了賦值,可以對數(shù)據(jù)進行修改但是不會觸發(fā)updated,在這里可以做初始數(shù)據(jù)的獲取 3、beforeMount render準備要渲染了,函數(shù)中虛擬dom已經(jīng)創(chuàng)建完成,這時候改變數(shù)據(jù)也不會觸發(fā)update,在這里可以做初始數(shù)據(jù)的獲取 4、mounted 開始render,渲染出真實dom,執(zhí)行mounted鉤子函數(shù),組件已經(jīng)出現(xiàn)在頁面中,數(shù)據(jù),事件,都DOM都處理好了。這里你 可以改是進行真實的DOM操作 5、beforeUpdate 組件,實例數(shù)據(jù)更新之前會執(zhí)行的函數(shù),虛擬DOM會重新構建虛擬DOM,與上一次的虛擬DOM對比后重新渲染。切記不可 進行數(shù)據(jù)修改否則會出現(xiàn)死循環(huán) 6、updated 更新完會執(zhí)行的函數(shù),切記不可進行數(shù)據(jù)修改否則會出現(xiàn)死循環(huán) 7、beforeDestroy 實例被銷毀之前會執(zhí)行的函數(shù),做善后的工作,清除計時器,清除非指令綁定的事件等等 8、destroyed 實例被銷毀后會執(zhí)行的函數(shù),也可以做善后工作。 <template>
<div class="hello">
Hello World!
</div>
</template>
<script>
export default {
name: "HelloWorld",
data() {
return {
msg: "Welcome to Your Vue.js App"
};
},
beforeCreate: function() {
console.log("data屬性光聲明沒有賦值的時候");
},
created: function() {
console.log("data屬性完成了賦值");
},
beforeMount: function() {
console.log("頁面上的{{name}}還沒有被渲染成真正的數(shù)據(jù)");
},
mounted: function() {
console.log("頁面上的{{name}}被渲染成真正的數(shù)據(jù)");
},
beforeUpdate: function() {
console.log(" 數(shù)據(jù)(data屬性)更新之前會執(zhí)行的函數(shù)");
},
updated: function() {
console.log("數(shù)據(jù)(data屬性)更新完會執(zhí)行的函數(shù)");
},
beforeDestroy: function() {
console.log("實例被銷毀之前會執(zhí)行的函數(shù)");
},
destroyed: function() {
console.log("實例被銷毀后會執(zhí)行的函數(shù)");
}
};
</script>
<style scoped>
</style>
console這樣一個輸出順序:大概這樣一個 生命周期鉤子函數(shù)執(zhí)行的順序,包括我之前是用angular開發(fā)跟vue一樣 他也有自己的生命周期鉤子函數(shù)。 生命周期簡單來說就是一個組件從創(chuàng)建到初始化到銷毀的一個過程,在這個過程中有這些生命周期鉤子函數(shù)我們可以更方便的去操作整一個組件。 以上就是vue生命周期鉤子鉤子函數(shù)的介紹(附示例)的詳細內容,更多請關注php中文網(wǎng)其它相關文章! 網(wǎng)站建設是一個廣義的術語,涵蓋了許多不同的技能和學科中所使用的生產(chǎn)和維護的網(wǎng)站。 |
溫馨提示:喜歡本站的話,請收藏一下本站!