How would I add a key to a mapped variable statement like below?
const limit = Math.max(...props.data.map(x => x.count), 0);
I'm getting an error in React stating "Each child in a list should have a unique "key" prop." I know how to add a key to an HTML object, but I'm not sure how to do it in this case.
Basically this error means that you should add a 'key' prop for components when you do map() , to help react decide which components to re-render instead of re-rendering the whole list
you do for example :
myList.map( element => <Component key={element.id} /> )
So the error is not related to the code you attached ,
You can try doing something like this
let mp = new Map();
for(let i=0; i<data.length;i++){
mp.set(MathmaxFunction,i)
}
console.log(mp.keys())
Could use mapped index:
const props = [{
count: 8
}, {
count: 7
}, {
count: 3
}]
const limit = props.map((x, index) => {
return {
count: Math.max(x.count, 0),
key: `elementName${index}`
}
})
console.log(limit)Each item would be limit.count and limit.key
Add a string 'elementName' to avoid duplicate key names