vue面試題之一:生命周期函數(shù)面試題

1. 生命周期函數(shù)面試題

1. 什么是vue生命周期?

Vue 實例從創(chuàng)建到銷毀的過程句携,就是生命周期榔幸。也就是從開始創(chuàng)建、初始化數(shù)據(jù)矮嫉、編譯模板削咆、掛載DOM-渲染、更新-渲染蠢笋、卸載等一系列的過程拨齐,我們稱這是 Vue 的生命周期。

2. vue生命周期的作用是什么

Vue 所有的功能的實現(xiàn)都是圍繞其生命周期進行的昨寞,在生命周期的不同階段調(diào)用對應的鉤子函數(shù)可以實現(xiàn)組件數(shù)據(jù)管理和DOM渲染兩大重要功能瞻惋。
生命周期中有多個事件鉤子,在控制整個vue實例的過程時更容易形成好的邏輯援岩。

3. 第一次頁面加載會觸發(fā)哪幾個鉤子歼狼?

beforeCreate , created 享怀, beforeMount 羽峰,mounted 這幾個鉤子

4. 簡述每個周期具體適合哪些場景?
  • beforeCreate:創(chuàng)建前添瓷,此階段為實例初始化之后限寞,this指向創(chuàng)建的實例,此時的數(shù)據(jù)觀察事件機制都未形成仰坦,不能獲得DOM節(jié)點。

    data计雌,computed悄晃,watch,methods 上的方法和數(shù)據(jù)均不能訪問凿滤。

    可以在這加個loading事件妈橄。

  • created:創(chuàng)建后,此階段為實例已經(jīng)創(chuàng)建翁脆,完成數(shù)據(jù)(data眷蚓、props、computed)的初始化導入依賴項反番。

    可訪問 data computed watch methods 上的方法和數(shù)據(jù)沙热。

    初始化完成時的事件寫在這里叉钥,異步請求也適宜在這里調(diào)用(請求不宜過多,避免白屏時間太長)篙贸。

    可以在這里結束loading事件投队,還做一些初始化,實現(xiàn)函數(shù)自執(zhí)行爵川。

    未掛載DOM敷鸦,若在此階段進行DOM操作一定要放在Vue.nextTick()的回調(diào)函數(shù)中。

  • beforeMount:掛載前寝贡,雖然得不到具體的DOM元素扒披,但vue掛載的根節(jié)點已經(jīng)創(chuàng)建,下面vue對DOM的操作將圍繞這個根元素繼續(xù)進行圃泡。

    beforeMount這個階段是過渡性的碟案,一般一個項目只能用到一兩次。

  • mounted:掛載洞焙,完成創(chuàng)建vm.$el蟆淀,和雙向綁定

    完成掛載DOM和渲染,可在mounted鉤子函數(shù)中對掛載的DOM進行操作澡匪。

    可在這發(fā)起后端請求熔任,拿回數(shù)據(jù),配合路由鉤子做一些事情唁情。

  • beforeUpdate:數(shù)據(jù)更新前疑苔,數(shù)據(jù)驅(qū)動DOM。

    在數(shù)據(jù)更新后雖然沒有立即更新數(shù)據(jù)甸鸟,但是DOM中的數(shù)據(jù)會改變惦费,這是vue雙向數(shù)據(jù)綁定的作用。

    可在更新前訪問現(xiàn)有的DOM抢韭,如手動移出添加的事件監(jiān)聽器薪贫。

  • updated:數(shù)據(jù)更新后,完成虛擬DOM的重新渲染和打補丁刻恭。

    組件DOM已完成更新,可執(zhí)行依賴的DOM操作鳍贾。

    注意:不要在此函數(shù)中操作數(shù)據(jù)(修改屬性),會陷入死循環(huán)骑科。

  • activated:在使用vue-router時有時需要使用<keep-alive></keep-alive>來緩存組件狀態(tài)橡淑,這個時候created鉤子就不會被重復調(diào)用了。

    如果我們的子組件需要在每次加載的時候進行某些操作咆爽,可以使用activated鉤子觸發(fā)梁棠。

  • deactivated:<keep-alive></keep-alive>組件被移除時使用置森。

  • beforeDestroy:銷毀前,

    可做一些刪除提示掰茶,如:您確定刪除xx嗎暇藏?

  • destroyed:銷毀后,當前組件已被刪除濒蒋,銷毀監(jiān)聽事件盐碱,組件、事件沪伙、子實例也被銷毀瓮顽。

    這時組件已經(jīng)沒有了,無法操作里面的任何東西了围橡。

5. 父子組件的生命周期
  • 執(zhí)行順序:
    • 父組件開始執(zhí)行到beforeMount 然后開始子組件執(zhí)行暖混,最后是父組件mounted。
    • 如果有兄弟組件翁授,父組件開始執(zhí)行到beforeMount拣播,然后兄弟組件依次執(zhí)行到beforeMount,然后按照順序執(zhí)行mounted收擦,最后執(zhí)行父組件的mounted贮配。
  • 當子組件掛載完成后,父組件才會掛載塞赂。
  • 當子組件完成掛在后泪勒,父組件會主動執(zhí)行一次beforeUpdated/updated鉤子函數(shù)(僅首次)
  • 父子組件在data變化中是分別監(jiān)控的,但是更新props中的數(shù)據(jù)是關聯(lián)的宴猾。
  • 銷毀父組件時圆存,先將子組件銷毀后才會銷毀父組件。
  • 兄弟組件的初始化(mounted之前)是分開進行仇哆,掛載是從上到下依次進行
  • 當沒有數(shù)據(jù)關聯(lián)時沦辙,兄弟組件之間的更新和銷毀是互不關聯(lián)的

以上是經(jīng)過參考很多同行分享與官方文檔,匯總的一份總結讹剔,如有不對油讯,請指出,最后感謝大家觀看辟拷,求點贊,求分享阐斜,求評論衫冻,求打賞~~

最后編輯于
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市谒出,隨后出現(xiàn)的幾起案子隅俘,更是在濱河造成了極大的恐慌邻奠,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,968評論 6 482
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件为居,死亡現(xiàn)場離奇詭異碌宴,居然都是意外死亡,警方通過查閱死者的電腦和手機贰镣,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,601評論 2 382
  • 文/潘曉璐 我一進店門碑隆,熙熙樓的掌柜王于貴愁眉苦臉地迎上來蹬音,“玉大人,你說我怎么就攤上這事劫狠∮啦浚” “怎么了?”我有些...
    開封第一講書人閱讀 153,220評論 0 344
  • 文/不壞的土叔 我叫張陵阐肤,是天一觀的道長孕惜。 經(jīng)常有香客問我晨炕,道長,這世上最難降的妖魔是什么瓮栗? 我笑而不...
    開封第一講書人閱讀 55,416評論 1 279
  • 正文 為了忘掉前任费奸,我火速辦了婚禮,結果婚禮上微服,老公的妹妹穿的比我還像新娘缨历。我一直安慰自己糙麦,他們只是感情好赡磅,可當我...
    茶點故事閱讀 64,425評論 5 374
  • 文/花漫 我一把揭開白布焚廊。 她就那樣靜靜地躺著伴鳖,像睡著了一般。 火紅的嫁衣襯著肌膚如雪搞疗。 梳的紋絲不亂的頭發(fā)上须肆,一...
    開封第一講書人閱讀 49,144評論 1 285
  • 那天豌汇,我揣著相機與錄音,去河邊找鬼拒贱。 笑死逻澳,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的苞氮。 我是一名探鬼主播,決...
    沈念sama閱讀 38,432評論 3 401
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼霸旗!你這毒婦竟也來了?” 一聲冷哼從身側響起撵枢,我...
    開封第一講書人閱讀 37,088評論 0 261
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎箱蟆,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體空猜,經(jīng)...
    沈念sama閱讀 43,586評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡坝疼,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,028評論 2 325
  • 正文 我和宋清朗相戀三年谆沃,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片耕陷。...
    茶點故事閱讀 38,137評論 1 334
  • 序言:一個原本活蹦亂跳的男人離奇死亡哟沫,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出嗜诀,到底是詐尸還是另有隱情孔祸,我是刑警寧澤,帶...
    沈念sama閱讀 33,783評論 4 324
  • 正文 年R本政府宣布筑公,位于F島的核電站匣屡,受9級特大地震影響拇涤,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜鹅士,卻給世界環(huán)境...
    茶點故事閱讀 39,343評論 3 307
  • 文/蒙蒙 一也拜、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧蔓钟,春花似錦、人聲如沸滥沫。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,333評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽踪央。三九已至,卻和暖如春镐牺,著一層夾襖步出監(jiān)牢的瞬間魁莉,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,559評論 1 262
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留检疫,地道東北人。 一個月前我還...
    沈念sama閱讀 45,595評論 2 355
  • 正文 我出身青樓夺溢,卻偏偏與公主長得像烛谊,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子状勤,可洞房花燭夜當晚...
    茶點故事閱讀 42,901評論 2 345

推薦閱讀更多精彩內(nèi)容