react 單向資料流和狀態提公升(state)

2021-09-12 13:59:48 字數 611 閱讀 6122

1.父元件傳遞給子元件props 唯讀

props 是一種從父級向子級傳遞資料的方法。

無論是使用函式或是類來宣告乙個元件,它決不能修改它自己的props。

function sum(a, b)
類似於上面的這種函式稱為「純函式」,它沒有改變它自己的輸入值,當傳入的值相同時,總是會返回相同的結果。

子元件要想父元件傳來的props 

在react中,這個問題通常是通過讓元件「受控」來解決。就像能夠接受valueonchange這兩個prop屬性值,自定義元件 也能接受來自 父元件的temperature變數和ontemperaturechange方法作為props屬性值。

讓子元件通過方法 把要改變的props傳遞給父元件的方法,父元件通過傳過去的方法改變state

2.state 通過setstate 改變

3.state 提公升(狀態提公升)

在react中,狀態分享是通過將state資料提公升至離需要這些資料的元件最近的父元件來完成的。這就是所謂的狀態提公升

單向資料流

props是單向繫結的,當父元件的屬性變化時,將傳導給子元件,但是不會反過來 而且不允許子元件直接修改父元件中的資料,報錯 解決方式 方式1 如果子元件想把它作為區域性資料來使用,可以將資料存入另乙個變數中再操作,不影響父元件中的資料 方式2 如果子元件想修改資料並且同步更新到父元件,兩個方法 a....

單向資料流

doctype html html lang en head meta charset utf 8 title vue title script src bower components vue dist vue.js script head body div id box aaa aaa div ...

單向資料流

所有的 prop 都使得其父子 prop 之間形成了乙個單向下行繫結 父級 prop 的更新會向下流動到子元件中,但是反過來則不行。這樣會防止從子元件意外變更父級元件的狀態,從而導致你的應用的資料流向難以理解。額外的,每次父級元件發生變更時,子元件中所有的 prop 都將會重新整理為最新的值。這意味...