反应：独特的“关键”道具不适用于表格行？

【问题标题】：React: unique "key" prop does not apply to table rows?反应：独特的“关键”道具不适用于表格行？
【发布时间】：2018-05-20 15:35:11
【问题描述】：

React 使用 key prop 来识别元素并正确协调。以下代码将给出控制台警告Warning: Each child in an array or iterator should have a unique "key" prop。

const List = () => 
  <ul>
    {[...Array(3)].map((_, idx) => <li>{idx}</li>)}
  </ul>

虽然不会

const Table = () => 
  <table>
    <tbody>
      {[...Array(3)].map((_, idx) => <tr><td>{idx}</td></tr>)}
    </tbody>
  </table>

为什么在使用表格行时不需要唯一键道具？

【问题讨论】：

标签： reactjs key tablerow listitem

【解决方案1】：

数组或迭代器中的每个子项都需要唯一键，因此您可能检查错误。因为 react 与 html 标签的类型无关。

// react.development.js
function validateChildKeys(node, parentType) {
  if (typeof node !== 'object') {
    return;
  }
  if (Array.isArray(node)) {
    for (var i = 0; i < node.length; i++) {
      var child = node[i];
      if (isValidElement(child)) {
        validateExplicitKey(child, parentType);
      }
    }
  }

【讨论】：

我觉得{[...Array(3)].map((_, idx) => <tr><td>{idx}</td></tr>)}返回一个数组有点明显。