reactdom.render (
document.getelementbyid('root')
)編譯後的**
reactdom.render（
document.createelement(heard,null)
document.getelementbyid('root')
）** 過程：我們把heard元件給了createelement函式，函式返回相應的jsx元素傳遞給我的
reactdom.render()讓reactdom把jsx元素轉化成真正的dom元素插入到指定的容器中
** 元件的掛載： react.js將元件渲染，構建dom元素插入頁面的過程稱之為元件的掛載
react.js對於每個元件都有乙個這樣的過程：
初始化元件 -> 元件掛載頁面過程
constructor -> render() -> 構建dom元素插入到指定的容器中
** react元件讓我們更加了解react元件的掛載過程插入了兩個方法：
-> constructor()
-> componentwillmount()
-> render() ->構建dom元素插入到容器中
-> componentdidmount()
-> componentwillunmount()//元件被隱藏的時候就是移除時呼叫；
### 元件總結：
** constructor：存放元件的初始狀態 state
** componentwillmount 元件的啟動，ajax請求，定時器的啟動等
** componentwillunmount 元件頁面上的銷毀，清除
** componentdidmount dom元素元件掛載成功，比如動畫
** shouldcomponentupdate(nextprops, nextstate) 控制項是否重新渲染，返回false表示不渲染;
nextprops:props物件， nextstate：state物件
if (newstate.num%5 === 0) else
** componentwillreceiveprops(nextprops) 子元件從父元件接收到新的props之前呼叫；（排除銷毀元件）
父元件通過setstate方法修改state狀態，傳遞給子元件新的props在渲染之前呼叫
componentwillreceiveprops -> componentwillupdate -> render - componentdidupdate
** componentwillupdate() 元件開始更新之前呼叫，就是呼叫setstate方法後，會呼叫這個方法，
然後在呼叫render方法重新渲染dom元素；
** componentdidupdate() 元件重新掛載成功後呼叫;
componentwillupdate -> render() -> componentdidupdate()
複製**
import react, from 'react';
constructor
() console.log('constructor1')
}componentwillmount
() componentdidmount
() componentwillupdate
() componentdidupdate
() componentwillreceiveprops(nextprops)
componentwillunmount
() handleupdate = () => )
}render
() }class index extends component
}handleshoworhide
() )
}handlecick = () => )
}render
() }export default index
複製**
React生命週期詳解
前言 學習react，生命週期很重要，我們了解完生命週期的各個元件，對寫高效能元件會有很大的幫助.ract生命週期 react 生命週期分為三種狀態 1.初始化 2.更新 3.銷毀 初始化 1 getdefaultprops 設定預設的props，也可以用dufaultprops設定元件的預設屬性....
react生命週期詳解
1 生命週期指的是元件從初始化開始到結束的過程 或者是生命週期是描述react元件從開始到結束的過程 2 每個react元件都具有生命週期 3 react都對元件通過生命週期給予的鉤子函式進行管理 指的是系統某些狀態和引數發生改變的時候，系統立馬去通知對應處理的函式 叫做鉤子函式。一方面有變動。另一...
React生命週期詳解
react生命週期 一 舊版 二 新版 從圖中，我們可以清楚知道react的生命週期分為三個部分 例項化 存在期和銷毀時。舊版生命週期如果要開啟async rendering，在render函式之前的所有函式，都有可能被執行多次。舊版的react生命週期看圖就可以啦，我們就不詳細講解了，下面我們來詳...