亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

淺談vue的生命周期

 更新時(shí)間:2022年01月07日 15:15:03   作者:愛吃辣的玉兔  
這篇文章主要為大家介紹了vue的生命周期,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下,希望能夠給你帶來幫助

1.什么是生命周期?有什么作用?

每一個(gè)vue實(shí)例在創(chuàng)建時(shí)都要經(jīng)歷一系列的初始化過程-----例如需要設(shè)置監(jiān)聽,編譯模板,將實(shí)例掛載到dom并在數(shù)據(jù)發(fā)生變化時(shí)更新dom等等.同時(shí)這個(gè)時(shí)候也會(huì)運(yùn)行一些生命周期鉤子的函數(shù),這些函數(shù),給用戶在不同階段添加代碼的機(jī)會(huì).例如:如果需要某些插件操作dom節(jié)點(diǎn),如果想在頁面渲染之后彈出廣告,那我們們最早可以再mounted中進(jìn)行.

2.第一次加載頁面會(huì)觸發(fā)哪幾個(gè)鉤子?

beforeCreate created beforeMount mounted

3.簡述每個(gè)周期應(yīng)用于哪個(gè)場景?

beforeCreate:在new一個(gè)實(shí)例后,只有一些默認(rèn)的生命鉤子和默認(rèn)事件,其他的東西還沒有創(chuàng)建,在beforeCreate生命周期執(zhí)行時(shí),data和methods中的數(shù)據(jù)還沒有初始化,不能在這個(gè)階段使用data中的數(shù)據(jù)和methods的方法.

created:data和methods中的數(shù)據(jù)都已經(jīng)初始化好了,如果調(diào)用methods中的方法和操作data中的數(shù)據(jù)最早在這個(gè)階段進(jìn)行.

beforeMount:執(zhí)行這個(gè)鉤子事,內(nèi)存中已經(jīng)編譯好了模板,但是還沒有掛載到頁面中,此時(shí)的頁面還是舊的

mounted:執(zhí)行到這個(gè)鉤子時(shí),說明vue實(shí)例已經(jīng)初始化完成,此時(shí)組件脫離了創(chuàng)建階段進(jìn)入到了運(yùn)行階段,如果需要某些插件操作dom節(jié)點(diǎn),那我們們最早可以再mounted中進(jìn)行

beforeUpdate:當(dāng)執(zhí)行這個(gè)鉤子時(shí),頁面還是舊的,data中的數(shù)據(jù)是更新后的,但是頁面的數(shù)據(jù)和data中的數(shù)據(jù)還沒有同步.

updated:頁面和data中的數(shù)據(jù)保持同步,頁面是新的了.

beforeDestory:vue實(shí)例開始從運(yùn)行階段進(jìn)入銷毀階段,這時(shí),data和methods,指令,過濾器.......都是可用的,還沒有真正銷毀.

destoryed:這時(shí),data和methods,指令,過濾器.......都是不可用的,組件已經(jīng)被銷毀了.

4.created和mounted的區(qū)別

created在模板渲染成html前調(diào)用,即通常初始化某些屬性值,然后在渲染成視圖.

mounted在模板渲染成html后調(diào)用,通常是頁面初始化之后,再對dom節(jié)點(diǎn)進(jìn)行操作時(shí).

5.vue在哪個(gè)生命周期獲取數(shù)據(jù)?

一般created/beforeMount/mounted都可以

總結(jié)

本篇文章就到這里了,希望能夠給你帶來幫助,也希望您能夠多多關(guān)注腳本之家的更多內(nèi)容!

相關(guān)文章

  • 利用Vue.js實(shí)現(xiàn)求職在線之職位查詢功能

    利用Vue.js實(shí)現(xiàn)求職在線之職位查詢功能

    Vue.js是當(dāng)下很火的一個(gè)JavaScript MVVM庫,它是以數(shù)據(jù)驅(qū)動(dòng)和組件化的思想構(gòu)建的。下面這篇文章主要給大家介紹了關(guān)于利用Vue.js實(shí)現(xiàn)求職在線之職位查詢功能的相關(guān)資料,需要的朋友可以參考借鑒,下面來一起看看吧。
    2017-07-07
  • 關(guān)于vuex強(qiáng)刷數(shù)據(jù)丟失問題解析

    關(guān)于vuex強(qiáng)刷數(shù)據(jù)丟失問題解析

    這篇文章主要介紹了關(guān)于vuex強(qiáng)刷數(shù)據(jù)丟失問題解析,本文給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
    2021-04-04
  • vue中三元表達(dá)式方法例子

    vue中三元表達(dá)式方法例子

    這篇文章主要給大家介紹了關(guān)于vue中三元表達(dá)式的相關(guān)資料,眾所周知三元表達(dá)式用來根據(jù)參數(shù)的不同執(zhí)行不同的代碼是很方便的,需要的朋友可以參考下
    2023-09-09
  • Vue項(xiàng)目組件化工程開發(fā)實(shí)踐方案

    Vue項(xiàng)目組件化工程開發(fā)實(shí)踐方案

    這篇文章主要介紹了Vue項(xiàng)目組件化工程開發(fā)實(shí)踐方案,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下
    2018-01-01
  • vue 項(xiàng)目@change多個(gè)參數(shù)傳值多個(gè)事件的操作

    vue 項(xiàng)目@change多個(gè)參數(shù)傳值多個(gè)事件的操作

    這篇文章主要介紹了vue 項(xiàng)目@change多個(gè)參數(shù)傳值多個(gè)事件的操作,具有很好的參考價(jià)值,希望對大家有所幫助。一起跟隨小編過來看看吧
    2021-01-01
  • vue源碼入口文件分析(推薦)

    vue源碼入口文件分析(推薦)

    這篇文章主要介紹了vue源碼入口文件分析(推薦),小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧
    2018-01-01
  • Vue mockjs編寫假數(shù)據(jù)并請求獲取實(shí)現(xiàn)流程

    Vue mockjs編寫假數(shù)據(jù)并請求獲取實(shí)現(xiàn)流程

    這篇文章主要介紹了Vue mockjs編寫假數(shù)據(jù)并請求獲取實(shí)現(xiàn)流程,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)吧
    2022-12-12
  • element表格行列拖拽的實(shí)現(xiàn)示例

    element表格行列拖拽的實(shí)現(xiàn)示例

    本文主要介紹了element表格行列拖拽的實(shí)現(xiàn)示例,文中通過示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
    2021-10-10
  • vue webpack build資源相對路徑的問題及解決方法

    vue webpack build資源相對路徑的問題及解決方法

    這篇文章主要介紹了vue webpack build資源相對路徑的問題,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
    2020-06-06
  • 使用Vue逐步實(shí)現(xiàn)Watch屬性詳解

    使用Vue逐步實(shí)現(xiàn)Watch屬性詳解

    這篇文章主要介紹了使用Vue逐步實(shí)現(xiàn)Watch屬性詳解,watch對象中的value分別支持函數(shù)、數(shù)組、字符串、對象,較為常用的是函數(shù)的方式,當(dāng)想要觀察一個(gè)對象以及對象中的每一個(gè)屬性的變化時(shí),便會(huì)用到對象的方式
    2022-08-08

最新評論