فهم المفاتيح الفريدة لمصفوفة في React.js

أقوم بإنشاء مكون React يقبل مصدر بيانات JSON وينشئ جدولًا قابلًا للفرز.
يحتوي كل صف من صفوف البيانات الديناميكية على مفتاح فريد مخصص له ولكن ما زلت أتلقى خطأ:

Each child in an array should have a unique "key" prop.
Check the render method of TableComponent.

هذا هو مكون الجدول

<table>
  <thead key="thead">
    <TableHeader columns={columnNames}/>
  </thead>
  <tbody key="tbody">
    { rows }
  </tbody>
</table>

مكون TableHeader عبارة عن صف واحد وله أيضًا مفتاح فريد مخصص له.

يتم إنشاء كل صف في الصفوف من مكون بمفتاح فريد:

<TableRowItem key={item.id} data={item} columns={columnNames}/>

وهذا هو مكون ال TableRowItem

var TableRowItem = React.createClass({
  render: function() {

    var td = function() {
        return this.props.columns.map(function(c) {
          return <td key={this.props.data[c]}>{this.props.data[c]}</td>;
        }, this);
      }.bind(this);

    return (
      <tr>{ td(this.props.item) }</tr>
    )
  }
});