-
React Fiber: React 16.0 +
查看全部 -
首先,index.js他是一個(gè)入口,首先他引入了react,幫助我們?nèi)ダ斫鈇pp開頭的組件,又引入了reactdom,幫助我們將組件渲染到一個(gè)root節(jié)點(diǎn)上。結(jié)尾的export default app是將其導(dǎo)出,這樣,在index.js中才能將他再導(dǎo)入進(jìn)去,導(dǎo)出和導(dǎo)入是配對(duì)使用的。
而app就是一個(gè)組件,她在app.js當(dāng)中定義,首先,需要定義一個(gè)APP的類,她繼承react.component.
當(dāng)一個(gè)類集成了react.componet后他就是react中的一個(gè)組件,react 組件中必須有一個(gè)函數(shù)叫做render,這個(gè)函數(shù)負(fù)責(zé)這個(gè)組件要顯示的內(nèi)容,并且這個(gè)函數(shù)會(huì)return一個(gè)內(nèi)容,他return回去的內(nèi)容就是這個(gè)組件要 顯示的內(nèi)容
查看全部 -
父組件通過屬性的形式向子組件傳遞參數(shù)
子組件通過props接受父組件傳遞過來的參數(shù)
查看全部 -
JSX js函數(shù)語法
<button?onClick={this.函數(shù)名稱}></button>
函數(shù)體寫在組件的render函數(shù)外
eg :?
函數(shù)名稱(){ ????.... }
查看全部 -
react組件封裝
自定義類繼承React.Component
render函數(shù) return 出dom結(jié)構(gòu)
export default 導(dǎo)出才能被外部index.js文件import引入
查看全部 -
index.js為react項(xiàng)目入口文件,?
import?React?from?'react'?--》識(shí)別?import?App?from?'./App' 語法
import?ReactDOM?from?'react-dom' ????????-->?幫助將組件渲染到dom節(jié)點(diǎn)(root)上 ReactDOM.render(<App?/>,?documnet.getElementByUd('root'))
?
查看全部 -
react中以大寫字母開頭一般為組件
查看全部 -
防止react報(bào)錯(cuò),增加index參數(shù),寫入key值。
查看全部 -
修改state需要調(diào)用this.SetState
通過es6的語法修改
{?
list: [...this.state.list,'hello world']
}
這里...應(yīng)該代表的是追加,正確的叫法叫做展開運(yùn)算符,展開后面的this.state.list。整體寫下來就是...this.state.list
查看全部 -
指定this的綁定對(duì)象
this.evnetImp.bind(this)
查看全部 -
ul里循環(huán)list的寫法
this.state.list.map(
(item)=>{
return <xxx>{item}</xxx>
}
)
查看全部 -
通過定義構(gòu)造函數(shù),來定義初始化的數(shù)據(jù)項(xiàng),初始化this.state
constructor(porps){
????supper(props);
? ? this.state={
? ? list:[
?'xxxxxxxx',
'xxxxxx'? ? ?
]
? ? }
}
查看全部 -
增加onClick事件(react風(fēng)格事件), 增加this.xxxx,點(diǎn)擊以后的事件實(shí)現(xiàn)。
查看全部 -
render函數(shù)返回的只能是一個(gè)大的JSX
否則會(huì)出錯(cuò)
查看全部 -
todolist的重名,重命名app相關(guān)的文件,變量為TodoList.
查看全部
舉報(bào)