React官網學習實踐 列表 Keys

渲染多樣的元件

const numbers = [1, 2, 3, 4, 5];

const listitems = numbers.map((number) =>
);reactdom.render(
,  document.getelementbyid('root')
);

key的使用, 都挺符合es6的物件的使用，也沒什麼好測試的了。定義乙個物件，裡面包含三個字段，選某一欄位作為key,保證其唯一性即可。

function blog(props) 

);return (
);}const posts = [
,  ];reactdom.render(
,  document.getelementbyid('root')
);

React 官網列子學習

除了接受輸入資料 通過this.props 元件還可以保持內部狀態資料 通過this.state 當乙個元件的狀態資料的變化，展現的標記將被重新呼叫render 更新。先看結構，下面是hook函式 hook函式 最早是指windows 系統下提供的一種用來替換dos 系統下的中斷的系統機制 現在則是...

react 官網筆記 01

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

react 官網筆記 06 狀態提公升

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