Each child in an array or iterator should have a unique "key" prop.

Each child in an array or iterator should have a unique "key" prop.
div is a child in array for  const content = props.posts.map((post) =>
    <div key={post.id}>
      <h3>{post.title}</h3>
      <p>{post.content}</p>
    </div>
  )




Issue : Each child in an array or iterator should have a unique "key" prop.

Cause: Each child in an array or iterator should have a unique "key" prop.

Solution:

In every map function we need  to use key for all child of an array.
In Map key must be assignned to every child of an  array .
Example:
const content = props.posts.map((item,i) =>
    <div key={i}>
      <h3>{item.title}</h3>
      <p>{item.content}</p>
    </div>

    <tr key={item.id}>
      <td>{item.title}</td>
      <ptditem.content}</td>
    </tr>

  )

<div> element  is the child of an array so key is used
<tr> element  is the child of an array so key is used.



Note:
1.If Every item in array has unique ID then ID can also be used as a key