成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

vue生命周期

yeooo / 759人閱讀

摘要:官網(wǎng)生命周期圖個人理解實例組件剛創(chuàng)建好,配置數(shù)據(jù)觀測之前的階段。數(shù)據(jù)更新時調(diào)用,發(fā)生在虛擬重新渲染和打補丁之前,該階段不會觸發(fā)附加的重渲染過程,該鉤子在服務(wù)器端渲染期間也不會被調(diào)用。

vue官網(wǎng)生命周期圖

個人理解

beforeCreate

實例組件剛創(chuàng)建好,配置數(shù)據(jù)觀測(observe data)之前的階段。el和data還未初始化。
在此階段,一般處理loading事件之類的事情。

created

實例創(chuàng)建完成,完成屬性綁定,這個階段DOM并沒有生成,$el屬性不存在。el未初始化,data初始化。
此階段,異步數(shù)據(jù)的請求操作宜在此調(diào)用,實現(xiàn)結(jié)束loading,做一些初始化處理,實現(xiàn)一些函數(shù)的自執(zhí)行。

beforeMounted

模板編譯之前的階段。el和data完成初始化,computed計算屬性中,只更改一次的屬性會在此階段加載。

mounted

完成模板編譯之后的階段。頁面的vue指令編譯成html代碼,例如:

{{message}}

會編譯成

compile completed!


此階段,一般向后端發(fā)起請求,取到數(shù)據(jù)之后,配合鉤子做一些處理。

beforeUpdated

數(shù)據(jù)更新時調(diào)用,發(fā)生在虛擬 DOM 重新渲染和打補丁之前,該階段不會觸發(fā)附加的重渲染過程,該鉤子在服務(wù)器端渲染期間也不會被調(diào)用。

updated

由于數(shù)據(jù)更改導(dǎo)致的虛擬 DOM 重新渲染和打補丁,在這之后會調(diào)用該鉤子。
當這個鉤子被調(diào)用時,組件 DOM 已經(jīng)更新,所以你現(xiàn)在可以執(zhí)行依賴于 DOM 的操作。
一般在此鉤子出做統(tǒng)一數(shù)據(jù)更新操作,如果需要區(qū)分不同數(shù)據(jù)的更新,同時操作DOM,可以使用nextTick函數(shù)。

activated
keep-alive 組件激活時調(diào)用。

deactivated
keep-alive 組件停用時調(diào)用。

beforeDestroy
實例銷毀之前調(diào)用。在這一步,實例仍然完全可用。

destroy
Vue 實例銷毀后調(diào)用。調(diào)用后,Vue 實例指示的所有東西都會解綁定,所有的事件監(jiān)聽器會被移除,所有的子實例也會被銷毀。

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/83690.html

相關(guān)文章

  • Vue生命周期

    摘要:和下面手動調(diào)用在控制臺中輸入在這個階段會銷毀實例,生命周期結(jié)束。外部實例中的函數(shù)顯示的效果參考鏈接組件的生命周期詳解生命周期 為什么要認識Vue的生命周期 Vue的生命周期是一個非常重要的點,如果不懂Vue的生命周期,那么很多時候,就不知道Vue的實際渲染時機,程序中會出現(xiàn)各種bug。 因此,學習Vue的生命周期是非常用必要的。 showImg(https://segmentfault...

    y1chuan 評論0 收藏0
  • 詳解vue生命周期

    摘要:注意看下此時還是沒有選項鉤子函數(shù)和間的生命周期在這一階段發(fā)生的事情還是比較多的。鉤子函數(shù)和鉤子函數(shù)間的生命周期當發(fā)現(xiàn)中的數(shù)據(jù)發(fā)生了改變,會觸發(fā)對應(yīng)組件的重新渲染,先后調(diào)用和鉤子函數(shù)。 首先,每個Vue實例在被創(chuàng)建之前都要經(jīng)過一系列的初始化過程,這個過程就是vue的生命周期。首先看一張圖吧~這是官方文檔上的圖片相信大家一定都會很熟悉: showImg(https://segmentfau...

    svtter 評論0 收藏0
  • vue生命周期

    摘要:接觸兩個月了,今天說一說里邊很重要的生命周期,記得最開始接觸的時候我問了一下周邊的同事,這些生命周期都有什么用,得到的答案是里邊可以操作屬性,你記住就完事了,于是乎。。。 接觸Vue兩個月了,今天說一說vue里邊很重要的生命周期,記得最開始接觸的時候我問了一下周邊的同事,這些生命周期都有什么用,得到的答案是mounted里邊可以操作屬性,你記住mounted就完事了,于是乎。。。 數(shù)據(jù)...

    godlong_X 評論0 收藏0
  • Vue 實例中的生命周期鉤子詳解

    摘要:實例在文檔中經(jīng)常會使用這個變量名表示實例,在實例化時,需要傳入一個選項對象,它可以包含數(shù)據(jù)模板掛載元素方法生命周期鉤子等選項。通俗說就是實例從創(chuàng)建到銷毀的過程,就是生命周期。 Vue 實例中的生命周期鉤子 Vue 框架的入口就是 Vue 實例,其實就是框架中的 view model ,它包含頁面中的業(yè)務(wù)處理邏輯、數(shù)據(jù)模型等,它的生命周期中有多個事件鉤子,讓我們在控制整個Vue實例的過程...

    gityuan 評論0 收藏0
  • Vue 2.0 淺談--生命周期和鉤子函數(shù)

    摘要:前言用也有一段時間了發(fā)現(xiàn)生命周期是很重要的一部分稍微懂得了一些東西特地來分享一下生命周期和鉤子函數(shù)介紹啥也不說先上圖圖為生命周期圖圖為生命周期圖圖為和鉤子函數(shù)比較重點看生命周期和鉤子函數(shù)具體上代碼自己粘走執(zhí)行創(chuàng)建前狀態(tài)創(chuàng)建完畢狀態(tài) 前言 用Vue也有一段時間了,發(fā)現(xiàn)生命周期是很重要的一部分,稍微懂得了一些東西,特地來分享一下. 生命周期和鉤子函數(shù)-介紹 啥也不說先上圖圖-1為 Vue...

    NikoManiac 評論0 收藏0

發(fā)表評論

0條評論

yeooo

|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<