小編給大家分享一下vue.js生命周期函數(shù)的作用,希望大家閱讀完這篇文章之后都有所收獲,下面讓我們一起去探討吧!

vue.js生命周期函數(shù)的作用:1、【beforeCreated()】表示在實例被完全初始化之前調(diào)用該函數(shù);2、【beforeMount()】此時模板已經(jīng)編譯完成,但也還未渲染到頁面;3、【updated()】頁面完成數(shù)據(jù)更新。
vue.js生命周期函數(shù)的作用:
前言
Vue實例有一個完整的生命周期,也就是說從開始創(chuàng)建、初始化數(shù)據(jù)、編譯模板、掛在DOM、渲染-更新-渲染、卸載等一系列過程,我們成為Vue 實例的生命周期,鉤子就是在某個階段給你一個做某些處理的機(jī)會。
各函數(shù)的作用
beforeCreated():
表示在實例被完全初始化之前調(diào)用該函數(shù);
created():
此時Vue的數(shù)據(jù)和方法(data,methods)都已經(jīng)初始化好了;
如果要操作data和methods,最早需要在這個函數(shù)中操作;
created完成后就開始編譯html模板,把模板字符串渲染為dom,最終在內(nèi)存中生成一個已經(jīng)編譯完成的最終模板;
最終模板僅僅存在于內(nèi)存中,并沒有被渲染到頁面中;
beforeMount():
此時模板已經(jīng)編譯完成,但也還未渲染到頁面;
mounted():
此時頁面已經(jīng)渲染完成,文檔中已存在dom節(jié)點(diǎn);
若要操作dom節(jié)點(diǎn),最早需要在這個函數(shù)中進(jìn)行;
執(zhí)行完mounted后,表示實例已經(jīng)創(chuàng)建完畢,若無其他操作,內(nèi)存不會再有活動;
beforeUpdate():
此時頁面已經(jīng)完全掛載,此函數(shù)表示在頁面數(shù)據(jù)發(fā)生改變時執(zhí)行;
數(shù)據(jù)改變時,頁面的數(shù)據(jù)并沒有更新,但data中的數(shù)據(jù)已經(jīng)更新完畢;
updated():
頁面完成數(shù)據(jù)更新;
beforeDestory():
當(dāng)執(zhí)行此函數(shù)時,Vue實例進(jìn)入銷毀的階段;
此時的filter、data、methods還能夠繼續(xù)使用;
destoryed():
組件已經(jīng)全部銷毀,所有的data、methods都無法使用
詳細(xì)流程圖



看完了這篇文章,相信你對“vue.js生命周期函數(shù)的作用”有了一定的了解,如果想了解更多相關(guān)知識,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,感謝各位的閱讀!
本文標(biāo)題:vue.js生命周期函數(shù)的作用-創(chuàng)新互聯(lián)
網(wǎng)頁URL:http://www.chinadenli.net/article18/idigp.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供自適應(yīng)網(wǎng)站、搜索引擎優(yōu)化、定制開發(fā)、網(wǎng)站收錄、標(biāo)簽優(yōu)化、網(wǎng)站營銷
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)