為什麼React16 3的getDerivedStateFromProps會和非同步渲染不相容?

時間 2021-05-31 11:53:23

1樓:尹千江

首先你要知道什麼是React的非同步渲染,React 通過 Fiber 架構使得一次 reconciliation(可以理解為diff過程)可以被中斷,通過 workInProgress 可以從中斷的位置恢復並繼續執行這次 reconciliation。

其次 getDerivedStateFromProps 這個生命週期是為了取代 componentWillReceiveProps 的,一開始被設計為當父元件重新渲染時才呼叫。

但是非同步渲染模式下,這樣就會造成乙個問題,中斷處的 Fiber 節點在每次 reconciliation 恢復的時候都會 re-render,而 React 分不清到底是因為父元件重新渲染造成的 re-render 還是子元件自己setState/forceUpdate 造成的 re-render ,它不知道應不應該觸發 getDerivedStateFromProps,所以React 索性讓以上幾種情況都可以觸發 getDerivedStateFromProps 鉤子, 讓這個生命週期變為每次重新渲染的時候都觸發以相容非同步渲染。

2樓:成楠Peter

正好之前看過React16+之後的原始碼。非同步渲染是React16+之後才有的功能,使用的是requestIdleCallback這個API,對於不相容這個API的,React專門寫了乙個時間切片的庫相容,所以React的非同步渲染是逐步完善的,現在的版本React也不推薦在生產上使用非同步渲染。

回到你的問題,getDerivedStateFromProps與非同步渲染不相容的原因,可能只是React的非同步渲染功能在逐步完善。

你為什麼喜歡 React?

小星ZlpwGreat react 寫js 多一點,剛開始寫vue 沒搞懂,後面寫 react 搞懂了,後面就一直寫 react 了 沒什麼喜不喜歡的,會了就和吃飯一樣,為什麼你喜歡用筷子吃飯這種 多試試吧 Nero 主要的setState,讓UI f data 這樣的函式式模式體現得淋漓盡致。資料...

React 為什麼要引入 class component?

因為React發布的時候前端還在刀耕火種,接受不了丘奇哥哥的理念。而且那個時候正好也是前端流行物件導向風格的時候,嘖嘖嘖。關鍵是你物件導向的話,要做戲做全套啊,光放個class在那裡有啥用,那麼多建立型模式都用上啊,依賴注入也用上啊?所以後來React乾脆函式式一擼到底,hooks應該是早就有了現在...

為什麼 React 原始碼不用 TypeScript 來寫?

楊健 語言上來講flow不比typescript差太多吧,sound方面明顯強於ts,最差的就是生態了,但是我乙個內部實現幾乎不依賴啥第三方庫,生態影響微乎其微 賀師俊 先看時間線。TypeScript是2012年10月發布的,2014年10月發的1.1 Flow是2014年11月發布的。React...