title: How to set the key properly when creating the elements in loop
body: <p>Can't figure out why I get this warning:</p>
  
  <blockquote>
    <p>"Warning: Each child in an array or iterator should have a unique
    "key" prop. Check the top-level render call using BootstrapTable."</p>
  </blockquote>
  
  <p>My code:</p>
  
  <pre><code>import React from 'react';
  import { BootstrapTable, TableHeaderColumn } from 'react-bootstrap-table';
  
  const data = [
    {id: 1, name: 'Item name 1', price: 100},
    {id: 3, name: 'Item name 3', price: 55},
    {id: 2, name: 'Item name 2', price: 100}
  ];
  
  const cols = Object.keys(data[0]);
  
  export default () =&gt; {
    return (
      &lt;BootstrapTable data={data}&gt;          
        {cols.map(name =&gt; {
          let key = name === 'id' ? true : false;
          return (
            &lt;TableHeaderColumn dataField={name} isKey={key}&gt;
              {name}
            &lt;/TableHeaderColumn&gt;
          );
        })}
      &lt;/BootstrapTable&gt;
    );
  };`
  </code></pre>