react 官網筆記 06 狀態提公升

2021-08-15 12:47:06 字數 325 閱讀 1356

如果兩個相鄰的元件想要使用相同的state去渲染元件,要實現乙個元件內部的邏輯更改state也會讓相鄰元件的ui更改,就需要使用'狀態提公升'了,原理就是把model提公升到離他們最近的公共父元件中,通過props傳遞給子元件, 但是遇到乙個問題,因為props是不應該被改變的,在子元件中無法通過setstate控制他們.

一種方法是,父元件不僅在props中傳遞資料,同時把handler也傳遞進來,通過子元件呼叫props.handler來修改父元件的state.從而觸發父元件的render來達到重新渲染子元件

原則:如果乙個元件的資料放在props或者state都可以的話,那他就不應該放到state中

react 官網筆記 01

之所以從react官網學習react,1是因為英語不好,希望能有所改進,內容不保證對錯,只是自己的理解 更好的請參見 在react中使用jsx語法,可以把它理解為一種融合html與js的新語言,整個react都是由他構成 react的 唯一渲染出口應該就是 reactdom.render docum...

React狀態提公升

react狀態提公升 react中的狀態提公升概括來說,就是將多個元件需要共享的狀態提公升到它們最近的父元件上.在父元件上改變這個狀態然後通過props分發給子元件.class one extends react.component render class two extends react.co...

React 狀態提公升

假設我們有這樣乙個需求,提供兩個輸入框 分別屬於兩個元件 保證輸入框裡面的內容同步 下面我們先來封裝乙個輸入框元件 input class input extends react.component this.handlechange this.handlechange.bind this hand...