react原始碼解析11 生命週期呼叫順序

2022-09-09 17:36:18 字數 796 閱讀 7979

1.開篇介紹和面試題

2.react的設計理念

3.react原始碼架構

4.原始碼目錄結構和除錯

5.jsx&核心api

6.legacy和concurrent模式入口函式

7.fiber架構

8.render階段

9.diff演算法

10.commit階段

11.生命週期

12.狀態更新流程

13.hooks原始碼

14.手寫hooks

15.scheduler&lane

16.concurrent模式

17.context

18事件系統

19.手寫迷你版react

20.總結&第一章的面試題解答

各階段生命週期執**況

函式元件hooks的週期會在hooks章節講解,這一章的使命週期主要針對類元件,各階段生命週期執**況看下圖:

其中紅色的部分不建議使用,需要注意的是commit階段生命週期在mutation各個子階段的執行順序,可以複習上一章

接下來根據乙個例子來講解在mount時和update時更新的具體順序:

React原始碼解析

距離第一篇 react原始碼解析 一 已經過去將近4個月的時間,由於是我第一次進行原始碼解析相關的寫作,思路和文筆還不夠成熟。一百多天以來,我基於讀者反饋反思這幾篇文章中的不足,同時也在不斷學習借鑑其他優秀作者的寫作方法和寫作思路。最終總結出對於自己的原始碼寫作來說,需要改進的幾點 1.示例 太多 ...

react 學習 3 生命週期

react 中的生命週期是指,在某乙個時刻元件會自動呼叫執行的函式。class mycomponent extends component componentwillmount render componentdidmount shouldcomponentupdate componentwillu...

Vue2 0生命週期 附原始碼

beforecreate beforecreate執行時,data選項沒有初始化 渲染的虛擬dom樹沒有生成,且沒有掛載到容器。可以在這加個loading事件,在載入例項時觸發 created 由於data選項已經存在,所以在此發起ajax請求最合理。資料越早拿回來越好 這結束loading事件 c...