1.purecomponent 前后進(jìn)行淺比較
class A extends React.purecomponet{
}底靠，
2.能直接對(duì)state直接進(jìn)行賦值 操作鳖眼，尤其使用purecomponent時(shí)會(huì)認(rèn)為賦值后的state與舊state是一個(gè)狀態(tài)從而不進(jìn)行渲染
3.不用index值key的值?
當(dāng)使用map，forEach遍歷數(shù)組時(shí)祭衩，因?yàn)樾枰胟ey來表示元素的唯一灶体。如果key = index，遍歷完的新數(shù)組的一個(gè)元素進(jìn)行刪除時(shí)掐暮，因?yàn)閕ndex是從0開始產(chǎn)生蝎抽，刪掉元素的index會(huì)繼承給下一個(gè)，這是下一個(gè)僅僅是index改變了但是數(shù)據(jù)內(nèi)容沒有變路克，但是新虛擬dom進(jìn)行舊虛擬dom數(shù)進(jìn)行對(duì)比發(fā)現(xiàn)前后這index=2的這元素的內(nèi)容不一樣的就好重新進(jìn)行一遍不必要的渲染
eg：插一個(gè)圖片例子 如圖刪除l3樟结，l4的index就變成
2了，虛擬dom對(duì)key進(jìn)行比較發(fā)現(xiàn)前后index=2的內(nèi)容改變了就渲染這部分精算，但實(shí)際上我們不希望它渲染因?yàn)閘4內(nèi)容沒有變
發(fā)現(xiàn)一個(gè)新的教程講的很詳細(xì)https://www.cnblogs.com/wonyun/p/6743988.html
3.獲取input值的方法
獲取input值的方法有兩種推薦ref瓢宦，因?yàn)槟苌賹?duì)dom操作就少對(duì)他操作
方法一：利用React的ref訪問DOM元素取值并提交 ？灰羽？刁笙？
方法二：利用DOM提供的Event對(duì)象的target事件屬性取值并提交
這個(gè)博主寫的詳解https://blog.csdn.net/hsany330/article/details/92764178
4.復(fù)制一個(gè)數(shù)組的問題 ? ? ? ?
復(fù)制于->侵刪 ?https://www.cnblogs.com/jkr666666/p/7930228.html
var a1 = [1,2,3]; ?
var a2 = a1;
a2[0] = 90;
console.log(a1[0]) //90
解析：數(shù)組是復(fù)合的數(shù)據(jù)類型，直接復(fù)制的話谦趣，只是復(fù)制了指向底層數(shù)據(jù)結(jié)構(gòu)的指針疲吸，而不能克隆一個(gè)全新的數(shù)據(jù)；
上面的代碼中前鹅，a2并不是a1的克隆摘悴，而是指向同一分?jǐn)?shù)據(jù)的另一個(gè)指針。修改a2,會(huì)直接導(dǎo)致a1的變化舰绘。
es5 可以同過下面的方法來克隆一個(gè)新的數(shù)組:
方法1：
var a1 = [1, 2, 3];
var a2 = a1.concat();
a2[0] = 90;
console.log(a1[0]) //1
方法2：
var a1 = [1, 2, 3];
var a2 = JSON.parse(JSON.stringify(a1));
a2[0] = 90;
console.log(a1[0]) //1
es6克隆一個(gè)新的數(shù)組的方法：
const a1 = [1,2,3];
寫法一：
const a2 = [...a1]; //當(dāng)添加的是對(duì)象時(shí)可以把[]換成{}
寫法2 ：
const [...a2] = a1;
5.點(diǎn)擊事件傳參問題?
eg：點(diǎn)擊delete時(shí)刪除當(dāng)前l(fā)i蹂喻，遇到的問題是怎么li的index傳給button，想到了
綁定函數(shù)bind()捂寿，前提用了map渲染數(shù)據(jù)產(chǎn)生li
<ul>
? ? <li key={index}>
? ? ? ? <button onClick={this.deleteItem.bind(this, index)}>delete</button>
? ? <li>
<ul/>
deleteItem(index: number, e) {
? ? // console.log(a, e.target);
? ? this.props.deleteItem(index);
? }
然后想問bind()到底有幾個(gè)參數(shù) 口四，看到了如下文章https://blog.csdn.net/genius_yym/article/details/54135567
this.handleclick.bind（this，要傳的參數(shù)）? handleclick（傳過來的參數(shù)秦陋，event） ?
事件–this.handleclick.bind（this蔓彩，要傳的參數(shù)）
函數(shù)–handleclick（傳過來的參數(shù)，event）/ handleclick（傳過來的參數(shù)）
版權(quán)聲明：本5小結(jié)為CSDN博主「mcya」的原創(chuàng)文章，遵循 CC 4.0 BY-SA 版權(quán)協(xié)議赤嚼，轉(zhuǎn)載請(qǐng)附上原文出處鏈接及本聲明旷赖。
6.受控組件與非受控組件
http://www.reibang.com/p/d2ca25587688
7.react usecallback
https://zhuanlan.zhihu.com/p/56975681
http://www.reibang.com/p/585554f77ecf
8.react hooks
http://www.reibang.com/p/6c43b440dab8
9.useState hooks?
setX(e=>e+1),設(shè)置函數(shù)參數(shù)可以是一個(gè)函數(shù)可以
https://www.cnblogs.com/fundebug/archive/2019/08/22/4-react-usestate-hook-examples.html
10.深拷貝與淺拷貝 前端數(shù)據(jù)結(jié)構(gòu)
http://www.reibang.com/p/5e0e8d183102
11 react 實(shí)現(xiàn)tree
12.函數(shù)組件渲染
https://blog.csdn.net/CVSvsvsvsvs/article/details/93421092
13.Functions are not valid as a React child. This may happen if you return a Component instead of <Component /> from render. Or maybe you meant to call this function rather than return it.
? ? in di
https://www.hellojava.com/a/54273.html
14.React中綁定this并傳參的三種方式
