我经常在做出反应的过程中得到这个错误，并且试图找出问题所在的地狱。有没有人有挖掘用户界面找到这些案例的提示？
Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of `Constructor`. See https://..... /react-warning-keys for more information.
我刚刚开始向div添加key={Math.random} - 有什么理由不这样做吗？ React只需要任何唯一的密钥吗？
如果是这种情况，我不确定为什么框架内部不会这样做;他们似乎已经为每个DIV生成了伪名...
错误消息对于指出问题的位置非常有帮助：
warning @ react-dev.js:18780validateExplicitKey @ react-dev.js:9316validateChildKeys @ react-dev.js:9378createElement @ react-dev.js:9483render @ Editor.tsx:245_renderValidatedComponentWithoutOwnerOrContext @ react-dev.js:5943_renderValidatedComponent @ react-dev.js:5963ReactCompositeComponent__renderValidatedComponent @ react-dev.js:12346_updateRenderedComponent @ react-dev.js:5916_performComponentUpdate @ react-dev.js:5900updateComponent @ react-dev.js:5829ReactCompositeComponent_updateComponent @ react-dev.js:12346performUpdateIfNecessary @ react-dev.js:5777performUpdateIfNecessary @ react-dev.js:13036runBatchedUpdates @ react-dev.js:13734perform @ react-dev.js:15623perform @ react-dev.js:15623perform @ react-dev.js:13691flushBatchedUpdates @ react-dev.js:13752ReactUpdates_flushBatchedUpdates @ react-dev.js:12346closeAll @ react-dev.js:15689perform @ react-dev.js:15636batchedUpdates @ react-dev.js:8455enqueueUpdate @ react-dev.js:13781enqueueUpdate @ react-dev.js:13371enqueueSetState @ react-dev.js:13537ReactComponent.setState @ react-dev.js:5204(anonymous function) @ Editor.tsx:100v @ zepto.min.js:2S.onreadystatechange @ zepto.min.js:2
OptionPicker.tsx:44template.initValue spot_intro
答案 0 :(得分：1)
其原因称为reconcilliation，并在react's Multiple Components doc page中进行了解释：
当React协调键控的孩子时，它会确保任何 带钥匙的孩子将被重新排序（而不是被破坏）或被销毁 （而不是重复使用）。
如果您使用Math.random，每次都会获得不同的ID，因此无法做出反应。 This very example出现在react的github问题中，正如Paul O'Shannessy指出的那样：
- 关键不是关于性能，而是关于身份（这反过来导致更好的性能）。随机分配和更改 值不是身份
- 我们无法在不知道您的数据建模方式的情况下实际提供密钥。我建议如果使用某种散列函数 你没有ids
- 我们在使用数组时已经有了内部键，但它们是数组中的索引。插入新元素时，这些键是 错。
我建议你阅读上述帖子。