react native 的兩個核心的屬性控制改變組件:props和state。
props是在父組件中進行設置,只要設置完成那么在組件的生命周期就定死了,不會發生改變。
針對數據變化修改的情況,我們需要使用state屬性;一般情況下,我們需要在constructor方法中初始化state,然后在你想要修改更新的時候調用setState方法。
方法名 | 作用 | 調用次數 |
---|---|---|
constructor | 構造函數,初始化需要的state | 1次 |
componentWillMount | 控件渲染前觸發 | 1次 |
render | 渲染控件的方法 | 多次 |
componentDidMount | 控件渲染后觸發 | 1次 |
componentWillReceiveProps | 組件接收到新的props時被調用 | 多次 |
shouldCompentUpdate | 當組件接收到props和state時被調用 | 多次 |
componentWillUpdate | props或者state改變,并且此前的shouldComponentUpdate為true會調用該方法 | 多次 |
componentDidUpdate | 組件重新渲染完成后會調用此方法 | 多次 |
componentWillUnmount | 組件卸載和銷毀之前被調用 | 1次 |
react native的組件的生命周期:
從圖中可以看出來組件的生命周期有三個階段:
第一個階段:初始化項目后,執行構造器,頁面加載之后,第一次渲染頁面,
第二個階段:是組件的運行中階段: 在這個階段主要點就是:state狀態的改變或者props屬性的改變, 當state發生改變的時候,會調用shouldComponentUpdate()方法, 這個方法是返回是一個boolean類型,用于判定state狀態是否改變,返回ture的時候,接下來將會執行componentWillUpdate()方法更新組件,然后再一次的執行render()方法,渲染頁面,之后執行componentDidUpdate()方法,然后如果還有state狀態發生改變的會就還是這個流程執行; 但 如果props屬性發生改變的時候,就是觸發componentWillReceiveProps()方法,然后在執行shouldComponentUpdate()方法,接下來的流程就一樣了; 這就是運行中執行的流程;
第三個階段:組件的卸載,這個期間我現在接觸的比較少,因為react native 對這個階段是自己封裝好的,沒太用過,先了解以下:
組件卸載的時候,首先執行Unmount()方法,然后執行componentWillUnmount()方法然后就是結束了;
在使用這個地方的時候, 有一個示例:就是對于本地存儲的時候,當組件卸載的時候,可以在第三個階段對 本地儲存的數據進行清空操作;
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。