<tbody id="5vw1z"></tbody>
<rp id="5vw1z"></rp>
  •  

    第10題:React生命周期有哪些,16版本生命周期發生了哪些變化?

    15生命周期

    React生命周期有哪些,16版本生命周期發生了哪些變化?

    初始化階段

    • constructor 構造函數
    • getDefaultProps props默認值
    • getInitialState state默認值

    掛載階段

    • componentWillMount 組件初始化渲染前調用
    • render 組件渲染
    • componentDidMount組件掛載到 DOM后調用

    更新階段

    • componentWillReceiveProps 組件將要接收新 props前調用
    • shouldComponentUpdate 組件是否需要更新
    • componentWillUpdate 組件更新前調用
    • render 組件渲染
    • componentDidUpdate 組件更新后調用

    卸載階段

    • componentWillUnmount 組件卸載前調用

    16生命周期

    React生命周期有哪些,16版本生命周期發生了哪些變化?

    初始化階段

    • constructor 構造函數
    • getDefaultProps props默認值
    • getInitialState state默認值

    掛載階段

    • staticgetDerivedStateFromProps(props,state)
    • render
    • componentDidMount

    getDerivedStateFromProps:組件每次被 rerender的時候,包括在組件構建之后(虛擬 dom之后,實際 dom掛載之前),每次獲取新的 props或 state之后;每次接收新的props之后都會返回一個對象作為新的 state,返回null則說明不需要更新 state;配合 componentDidUpdate,可以覆蓋 componentWillReceiveProps的所有用法

    更新階段

    • staticgetDerivedStateFromProps(props,state)
    • shouldComponentUpdate
    • render
    • getSnapshotBeforeUpdate(prevProps,prevState)
    • componentDidUpdate

    getSnapshotBeforeUpdate:觸發時間: update發生的時候,在 render之后,在組件 dom渲染之前;返回一個值,作為 componentDidUpdate的第三個參數;配合 componentDidUpdate, 可以覆蓋 componentWillUpdate的所有用法

    卸載階段

    • componentWillUnmount

    錯誤處理

    • componentDidCatch

    React16新的生命周期棄用了 componentWillMount、componentWillReceivePorps,componentWillUpdate新增了 getDerivedStateFromProps、getSnapshotBeforeUpdate來代替棄用的三個鉤子函數。

    React16并沒有刪除這三個鉤子函數,但是不能和新增的鉤子函數混用, React17將會刪除這三個鉤子函數,新增了對錯誤的處理( componentDidCatch)

    「點點贊賞,手留余香」

    8

    給作者打賞,鼓勵TA抓緊創作!

    微信微信 支付寶支付寶

    還沒有人贊賞,快來當第一個贊賞的人吧!

    聲明:
    1. 本站所有文章教程及資源素材均來源于網絡與用戶分享或為本站原創,僅限用于學習和研究。
    2. 如果內容損害你的權益請聯系客服QQ:1642748312給予處理。
    碼云筆記 » 第10題:React生命周期有哪些,16版本生命周期發生了哪些變化?

    發表回復

    IT互聯網行業相關廣告投放 更專業 更精準

    立即查看 聯系我們
    亚洲 自拍 另类小说综合图区