I have given key prop to the child but still showing: Each child in a list should have a unique "key" prop


I am using moongodb and express in backend.
This is my component.

 return (
         <Addnote />
         <div className="row my-3">
             {notes.map((note) => {
                 return <Noteitem note={note} key={note._id}/>;


As stated in the comments, note._id is not unique. You can fix it to be unique or use the item’s index like so:

{notes.map((note, i) => {
  return <Noteitem note={note} key={i} />;

or shortened to:

{notes.map((note, i) => (
  <Noteitem note={note} key={i} />;

Answered By – John

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published