React v16.3.0 發布

本文轉自 FEPulse 公眾號(微信搜索 FEPulse,每日精選一條國內外最新前端資訊,為你把握前端脈搏)。

盼星星盼月亮,React 16.3 終於正式發布啦!

我們公眾號之前陸陸續續刊登了一些有關 React 16.3 的文章,借 React v16.3.0 正式發布之際,我們整理一下新版本中主要的新特性。

Official Context API

new Context API 與原先的 Context API 相對,只不過原先的是個試驗性的功能,存在很多問題,而這次正式引入了全新的 new Context API。

new Context API 主要解決的是父組件向子組件傳值只能一層一層通過 props 傳遞的問題,通過這個 API,我們現在可以讓數據跨層傳遞。

有關 new Context API 的更多內容,可以查看我們以前的文章。

【前端軼事】Dan Abramov 評價 new Context API

【前端好文】React New Context API 實踐

createRef API

16.3 之前,React 有兩種提供 ref 的方式:字元串和回調,因為字元串的方式有些問題,所以官方建議使用回調來使用 ref。而現在引入的 createRef API,據官方說是一種零缺點的使用 ref 的方式,回調方式也可以讓讓路了。

forwardRef API

高階組件是組件之間重用代碼的常用方式,高階組件通常會將 props 傳遞給它們包裹的組件,但是 refs 卻沒法傳遞,而 forwardRef API 就是解決這個問題的。背後原理大概就是 forwardRef API 攔截 ref 並且將之轉換成 prop。

Component Lifecycle Changes

React 的生命周期函數一直沒有什麼變化,但在新的複雜的場景下逐漸產生問題,所以 React 16.3 後將會廢棄 componentWillMount、componentWillReceiveProps 以及 componentWillUpdate 三個周期函數,新增 getDerivedStateFromProps 和 getSnapshotBeforeUpdate 兩個周期函數。詳細內容可以查看昨天的文章:

【前端好文】React 非同步渲染組件優化

各位也不必太驚慌,並不是升級了 16.3 就會立刻廢棄之前的周期函數,以前所有的周期函數在 16.x 甚至 17.x 中都能正常使用,只不過會收到警告信息,17.x 以後上面提到的三種廢棄的鉤子函數都將使用 UNSAFE_ 前綴。

StrictMode Component

StrictMode 是用於開發環境下提示潛在風險的工具,可以引導開發者遵循最佳實踐,如果你在 StrictMode 下看到警告,那麼這些警告的地方很可能會導致非同步渲染的錯誤。

在 16.3 中,StrictMode 可以幫助識別:

  • 識別具有不安全生命周期函數的組件;
  • 識別字元串方式的 ref;
  • 檢測意想不到的副作用。

最後,再次邀請大家關注我們的公眾號 FEPulse,第一時間獲取我們精心整理的最新的前端資訊。也歡迎在公眾號文章或者後台留言討論。


推薦閱讀:

React + Redux 性能優化
TypeScript 項目實戰
如何看待知乎使用 React 重構?
對React應用的一些思考
基於 Nest.js (nodejs 版的 spring ) 的 Notadd 2.0 Beta1 發布

TAG:前端開發 | 前端工程師 | React |