vue3的生命周期有哪些
Vue 3 引入了新的生命周期鉤子函數,并對一些舊的鉤子函數進行了重構或刪除。以下是一些 Vue 3 的生命周期鉤子函數:
1、beforeCreate:在實例創(chuàng)建之前調用,此時還沒有掛載,數據觀測 (data observer) 和事件尚未初始化。
2、created:實例創(chuàng)建完成后調用,此時已經完成了數據觀測 (data observer) 和事件初始化,但尚未掛載 DOM。
3、beforeMount:在掛載之前調用,相關的 render 函數首次被調用。可以在此時對模板進行編譯和渲染。
4、mounted:實例已經掛載到 DOM 上后調用。在這個時候,所有的?el?和?ref?都已經被解析,并且?$refs?已經被填充。
5、beforeUpdate:數據更新時調用,發(fā)生在虛擬 DOM 打補丁之前。可以在此時進行狀態(tài)更新或手動更改 DOM。
6、updated:數據更新完成后調用,發(fā)生在虛擬 DOM 打補丁和 DOM 更新之后。
7、beforeDestroy:實例銷毀之前調用。在這個階段,實例仍然完全可用。
8、destroyed:實例銷毀后調用。調用后,所有的事件監(jiān)聽器和子組件都將被移除,所有的子組件的?destroyed?鉤子也會被調用。
9、activated:當被激活的 keep-alive 組件重新進入時調用。
10、deactivated:當被激活的 keep-alive 組件離開時調用。
11、errorCaptured:在捕獲階段處理錯誤時調用。如果這個鉤子沒有返回值,或者返回?false,那么父組件的?errorCaptured?鉤子會被繼續(xù)調用;否則,該錯誤不會被進一步處理。
12、getDerivedStateFromProps:在每次渲染之前都會調用,用于從 props 派生出狀態(tài)。這是一個靜態(tài)方法,可以在組件創(chuàng)建之前或在組件銷毀之后進行更改。
13、renderTracked?和?renderTriggered:這兩個鉤子是在渲染過程中觸發(fā)的,前者在跟蹤渲染時觸發(fā),后者在強制觸發(fā)渲染時觸發(fā)。
14、setup:在 Vue 3 中,組件選項 API 被 Composition API 替代。setup?函數是 Composition API 的入口點,用于組織和復用組件邏輯。它是一個新的、更強大、更靈活的方式來定義組件選項。
下一篇:解析基于元素位置的固定定位原理
相關推薦
-
以實例為基礎,探索Golang中多態(tài)特性的學習方法
通過實例學習Golang中的多態(tài)特性多態(tài)是面向對象編程中的一個重要概念,它允許我們使用統(tǒng)一的接口來處理不同類型的對象。在Golang中,多態(tài)是通過接口來實現(xiàn)的。接口定義了對象的行為,而不關心對象的具體
-
學會ajax的關鍵組件清單:必備的包
快速掌握Ajax:必須要懂的包清單,需要具體代碼示例當今互聯(lián)網時代,網頁的交互性變得越來越重要。而Ajax技術的出現(xiàn),使得網頁能夠實現(xiàn)異步數據交互,提升了用戶體驗。如果你是一名前端開發(fā)人員,掌握Aja
-
Vue框架中的實例使用閉包的案例解析
閉包在Vue框架中的實際應用案例在Vue框架中,閉包是一種強大的概念,它可以用來創(chuàng)建私有變量和方法,以及實現(xiàn)封裝和繼承等功能。在這篇文章中些具體的示例,以展示閉包在Vue框架中的實際應用
-
分析和解析原型與原型鏈的特性及實例
原型和原型鏈的特性分析及實例解析在JavaScript中,原型和原型鏈是理解對象和繼承的關鍵概念。對于初學者來說,這可能是一個相當抽象和難以理解的概念。本文將詳細介紹原型和原型鏈的特性,并通過實例解析
-
學習Python繪圖的速成指南:繪制冰墩墩的代碼實例
快速上手Python繪圖:畫出冰墩墩的代碼示例Python是一種簡單易學且功能強大的編程語言,通過使用Python的繪圖庫,我們可以輕松地實現(xiàn)各種繪圖需求。在本篇文章中,我們將使用Python的繪圖庫















