Fix-React Native error Each child in a list should have a unique "key" prop
April 08, 2021
React Native error Each child in a list should have a unique “key” prop:
This error is thrown by react native if more than one child element in FlatList has the same key. It will show one error message as like below:
While loading items in a FlatList, we have to pass one keyExtractor that assigns one key for each element in the FlatList.
<FlatList
data={DATA}
renderItem={renderItem}
keyExtractor={item => item._id}
/>
So, if we have two or more items with the same key, this error is thrown. Normally, if you are getting data from the server and if the id of each item is separate, it will not throw any error.
But, if you are getting this error, you can:
- either make it sure that the server is sending unique keys/ids.
- You can create one unique id by using its different properties.