常見的一個(gè)報(bào)錯(cuò)內(nèi)容：原因可能真的很奇怪，但是那就那么三四種情況，在此記錄一下這個(gè)問題

console.js:213 Warning: Each child in a list should have a unique "key" prop.

Check the render method of `Panel`. It was passed a child from LogDialog. See https://reactjs.org/link/warning-keys for more information.

常見的報(bào)錯(cuò)情況總結(jié)

1.Map遍歷渲染數(shù)據(jù)

這是最常見的一種，也是最容易發(fā)現(xiàn)和解決的一種情況，相信做react開發(fā)的同學(xué)都知道這個(gè)問題

解決方式：給被遍歷的組件加上 key 屬性?

2.Table表格數(shù)據(jù)渲染

這個(gè)也是常見的一種，在antd中的table渲染的時(shí)候，要求每一行數(shù)據(jù)有一個(gè)單獨(dú)的key，或者給table設(shè)置rowKey屬性就可以解決

第一種解決方案：給table設(shè)置rowKey屬性?

第二種解決方案：給數(shù)據(jù)加上key屬性

3.Select選擇器中的Option?

?這個(gè)也是比較常見的一種吧，類似map渲染，一樣要加上key

解決辦法：在map里面的子組件加上key屬性

4.Modal 對話框組件

這個(gè)應(yīng)該是最難發(fā)現(xiàn)的一個(gè)的情況，解決辦法也是神奇，想不通為啥這個(gè)會報(bào)錯(cuò)，其他的遍歷我都能理解，但是這個(gè).....

解決辦法：給頁腳組件設(shè)置 key 屬性，寫一個(gè)固定值也可以解決這個(gè)報(bào)錯(cuò)