title: React: Siblings in a list must have unique key. Do the children of these list siblings need them too?
body: <p>I am generating a series of divs by using <code>.map()</code> on my state (created via the <code>useState()</code> React hook).</p>
  <p>Each of these divs has a unique React <code>key</code>. However, I still receive the following error:</p>
  <pre><code>Warning: Each child in a list should have a unique &quot;key&quot; prop.
  </code></pre>
  <p>Each of these <code>&lt;div&gt;</code> siblings has 30-50 children. Does each of those children need a unique React <code>key</code> as well?</p>
  <hr />
  <p>The React documentation (<a href="https://reactjs.org/docs/lists-and-keys.html" rel="nofollow noreferrer">https://reactjs.org/docs/lists-and-keys.html</a>) appears ambiguous on this point.</p>
  <p>It indicates that:</p>
  <ul>
  <li><p>&quot;A good rule of thumb is that elements inside the map() call need keys.&quot; (All elements? Or just the parent siblings?)</p>
  </li>
  <li><p>Keys must only be unique among siblings. (The scenario I describe follows this rule)</p>
  </li>
  </ul>
  <p>However none of its examples provide clarity on list siblings with many nested elements within.</p>
  <p>Thanks in advance for your help.</p>