React從0到1 元件生命週期

1、react 嚴格定義了元件的生命週期，生命週期可能會經歷如下三個過程

裝載過程（ mount），也就是把元件第一次在 dom 樹中渲染的過程；

更新過程（ update ），當元件被重新渲染的過程；

解除安裝過程（ unmount），元件從 dom 中刪除的過程 。

2、裝載過程

我們先來看裝載過程，當元件第一次被渲染的時候，依次呼叫的函式是如下這些：

constructor

getlnitialstate

getdefaultprops

componentwillmount

render

componentdidmount

1. constructor

es6中建立乙個元件的例項，無狀態的react元件不需要例項

1、初始化state

this.state =

this.onclickincbutton = this.onclickincbutton.bind(this);

this.onclickdecbutton = this.onclickdecbutton.bind(this);
3、getlnitialstate 和 getdefaultprops
react.createclass 方法創造的元件類才會用到這兩種方法，分別用來初始化state和props
4、render
用於渲染dom的函式，非常重要
5、componentwillmount 和 componentdidmount 
//元件裝載前

componentwillmount() 

//元件裝載後，dom已經存在，可以使用其他的庫，比如jq來執行其他操作
shouldcomponentupdate決定了乙個元件什麼時候不需要渲染，必須有返回值，true是渲染，false是不渲染
shouldcomponentupdate(nextprops, nextstate)
7、componentwillunmount 

用於解除安裝元件


 
react（四）元件的生命週期
元件的生命週期 當元件第一次渲染時，依次呼叫的過程 1 constructor 1 不是所有元件均會定義該函式 2 定義該函式的目的 this.state 例如，已有成員函式clickbtn，繫結this指向的方式可以是this.clickbtn this.clickbtn.bind this 2 ...
React（三） 元件的生命週期
react元件的生命週期分為三大部分 1 掛載 mount 我們把元件渲染，並且構造dom元素插入到頁面的過程稱為元件的掛載。元件掛載的過程 元件掛載先關函式，只在元件掛載的時候呼叫，在元件更新時不會執行 import react from react class test extends reac...
react 複習（2）元件的生命週期
當元件例項被建立並插入 dom 中時，其生命週期呼叫順序如下 constructor static getderivedstatefromprops static getderivedstatefromprops nextprops,prevstate nextprops 當傳入的type發生變化的...