React生命周期
每個組件都有幾個“生命周期方法”，您可以在此過程中的特定時間覆蓋運行代碼。前綴是will的方法在事情發(fā)生之前被調用痒芝，前綴的為did的方法在事情發(fā)生之后被調用包竹。
-
Mounting 當創(chuàng)建組件的實例并將其插入到DOM中時，將調用這些方法：
- constructor()
- componentWillMount()
- render()
- componentDidMount()
-
Updating 更新可能是傳入的參數(shù)或狀態(tài)的改變引起的喊巍。當重新呈現(xiàn)組件時，將調用這些方法：
- componentWillReceiveProps()
- shouldComponentUpdate()
- componentWillUpdate()
- render()
- componentDidUpdate()
-
Unmounting 當從DOM中刪除組件時調用此方法：
- componentWillUnmount()
我們將每個狀態(tài)的方法歸納一下可能會方便我們的記憶
三個狀態(tài)
- Mounting：已插入真實 DOM
- Updating：正在被重新渲染
- Unmounting：已移出真實 DOM
五種方法
- componentWillMount()
- componentDidMount()
- componentWillUpdate(object nextProps, object nextState)
- componentDidUpdate(object prevProps, object prevState)
- componentWillUnmount()
兩種特殊狀態(tài)
- componentWillReceiveProps(object nextProps)：已加載組件收到新的參數(shù)時調用
- shouldComponentUpdate(object nextProps, object nextState)：組件判斷是否重新渲染時調用
那么我們插入節(jié)點的時候箍鼓，組件都做了什么呢崭参？
- constructor()
- 構造函數(shù)，是用來初始化這個組件的款咖，可以讓組件的state根據(jù)傳入的props的值不同而不同何暮，如果你的組件是一個靜態(tài)的，就可以不適用這個函數(shù)铐殃，下面是官網(wǎng)的例子
constructor(props) { super(props); this.state = { color: props.initialColor }; } - 注意這里面代碼的第二行到第五行只能在第一次初始化的時候調用海洼，千萬別指望這種寫法能夠讓你時時的更新你的組件
- 構造函數(shù)，是用來初始化這個組件的款咖，可以讓組件的state根據(jù)傳入的props的值不同而不同何暮，如果你的組件是一個靜態(tài)的，就可以不適用這個函數(shù)铐殃，下面是官網(wǎng)的例子
- componentWillMount()
- 當你的組件要?插入DOM時立刻被調用，render()將在他的后面被調用
- 這個方法?不會同步更新state
- 這是唯一一個在服務器上調用的方法富腊，?應該使用constructor代替這個方法
- render()
- 這個是必須出現(xiàn)在你的組件中的方法坏逢，也是我們最經(jīng)常用的方法
- 在調用的時候應該檢查
this.state和this.props并且返回一個元素 - 在這個組件中，不要更改組件的狀態(tài)赘被，不要與?瀏覽器發(fā)生交互
- 如果你什么也不想讓任何元素插入DOM是整，請reture false或return null
- componentDidMount()
- 盡可能多的將網(wǎng)絡請求寫在這里
- 此方法中的設置狀態(tài)將觸發(fā)重新渲染。
接下來是更新節(jié)點
- componentWillReceiveProps()
- 在組件接收到新的props前被調用民假，
- shouldComponentUpdate()
- componentWillUpdate()
- render()
- componentDidUpdate()
//未完待續(xù)
