ReactJS組件生命週期

1.建立階段

    1).getDefaultProp

在建立類的時候調用，產生props該組件屬性

 

2.實例化階段

    React.render()啓動以後調用

    state:組件的屬性，主要是用來存儲組件自身須要的數據，每次數據的更新都是經過修改state屬性的值，ReactJS內部會監聽state屬性的變化，一旦發生變化的話，就會主動觸發組件的render方法來更新虛擬DOM結構。

    虛擬DOM：將真實的DOM結構映射成一個JSON數據結構。

    1).getInitialState

初始化該組件的state值，其返回值會賦值給組件的this.state屬性

    2).componentWillMount

在render以前調用此方法，業務邏輯的處理都應該放在這裏，如對state的操做等

    3).render

根據state的值，渲染並返回一個虛擬DOM

    4).componentDidMount

發生在render以後，在該方法中，ReactJS會使用render方法返回虛擬DOM對象來建立真實的DOM結構。組件內部能夠經過this.gerDOMNode()來獲取當前組件的節點

 

3.更新階段

    主要發生在用戶操做以後或父組件更新的時候，此時會根據用戶的操做行爲進行相應的頁面結構的調整

    1).componentWillReceiveProps

該方法發生在this.props被修改霍服組件調用setProps方法以後

    2).shouldComponentUpdate

用來攔截新的props霍state，根據邏輯來判斷是否須要更新

    3).componentWillUpdate

shouldComponentUpdate返回true，組件將會更新

    4).componentDidUpdate

組件更新完畢，咱們常在這裏作一些dom操做

 

4.銷燬階段

    1).componentWillUnMount

銷燬時被調用，一般作一些取消事件綁定，移除虛擬DOM中對應的組件數據結構、銷燬一些無效的定時器等工做