React v16.9 中unsafe的生命週期函數

https://zh-hans.reactjs.org/b...

Unsafe的生命週期

• componentWillMount → UNSAFE_componentWillMount

  • 沒有用過,不描述

• componentWillReceiveProps → UNSAFE_componentWillReceiveProps

  • 緣由：

    • 在一次渲染週期內,props屢次變化,形成該函數重複調用。
    • 父組件觸發子組件從新渲染,即便props未變化，依然會調用該函數

  • 方案

    1. 在render中處理最終須要的渲染相關數據

       • componentShouldUpdate 僅處理 props 相關
       • 使用memoize

    2. 使用getDerivedStateFromProps,僅會在渲染前調用，返回值應用於state,不經過setState隊列。

       • packagesreact-domsrcserverReactPartialRenderer.js

• componentWillUpdate → UNSAFE_componentWillUpdate

  • 緣由:

    • 設計用於保存組件在渲染前的狀態,好比讀取dom信息中的滾動值等。
    • 但實際中,可能會調用setState或者觸發react-redux中的action

  • 方案

    • 使用getSnapshotBeforeUpdate獲取dom信息，這是一個靜態方法。沒法使用setState等方法。