Warning: Each child in a list should have a unique "key" prop. with input - react

user_15978064 0
Viewed 312

i have this:

{array.map((item) => (
                <>
                    <input
                        key={item.id}
                        type="checkbox"
                    />
                    <h3>{item.value}</h3>
                </>
            ))}

and in the website i see the warning: "Warning: Each child in a list should have a unique "key" prop." but i put the "key" attribute. does anyone know why?

reactjs html javascript
1 Answers

The fragment element (<></>) is the top-level child element here, and it needs a key prop. The short syntax being used doesn't support adding an attribute, but the longer syntax does:

<React.Fragment key={item.id}>
  <input type="checkbox" />
  <h3>{item.value}</h3>
</React.Fragment>
user_3281930
Related