React:組件間的傳值、ref屬性獲取節(jié)點、setState是異步的

父組件向子組件傳值(屬性)

通過屬性的方式向子組件傳值:<TodoItem value={ 值 } />,子組件通過this.props.值名稱接收使用

子組件向父組件傳值(調(diào)用父組件的方法)

父組件把自身的方法通過屬性傳遞給子組件(需要在父組件中先把這個方法的this強制定為父組件,子組件調(diào)用時,才能改變父組件),子組件接收后通過調(diào)用父組件的方法,來實現(xiàn)子組件和父組件的通信

props 父組件通過屬性傳值給子組件時,子組件通過props接收

state 指組件中的數(shù)據(jù)

render 函數(shù):用來渲染組件中的內(nèi)容。

三者關(guān)系:

render? 函數(shù)什么時候執(zhí)行?

1. 組件第一次渲染的時候,會被默認(rèn)執(zhí)行一次。

2. 當(dāng)state數(shù)據(jù)發(fā)生變更的時候,render函數(shù)就會被重新執(zhí)行一次。

3. 當(dāng)props數(shù)據(jù)發(fā)生變化的時候,render函數(shù)就會被重新執(zhí)行一次。?




React中操作DOM,通過ref屬性實現(xiàn)

ref的值一般是一個函數(shù),會自動獲取DOM節(jié)點,然后傳到函數(shù)內(nèi)部?并聲明一個組件變量存放

ref寫在html標(biāo)簽上,獲得的是dom節(jié)點;

ref寫在組件標(biāo)簽上,獲取的是組件的js實例;

(1)ref的值可以是一個箭頭函數(shù),也可以是普通函數(shù)形式,但是需要提前保存this,否則this指向不對,我們需要的this指向當(dāng)前類。例如http://img.mukewang.com/climg/5ed3245509555dce05870262.jpg

(2)函數(shù)的參數(shù)是自定義的

(3)函數(shù)的參數(shù)與標(biāo)簽名、組件名基本一致,保持一致是一種習(xí)慣問題,便于區(qū)分綁定在哪個內(nèi)容上了。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容