Key issues when using FlatList

When trying to render swipeable in FlatList component, i get the following error:

ExceptionsManager.js:71 Warning: Each child in an array or iterator should have a unique “key” prop.

Check the render method of Swipeable. It was passed a child from DiscogsSearch. See https://fb.me/react-warning-keys for more information.

Is Swipeable compatible with Flatlist?

Also the swipe actions fire multiple times on one swipe, but i’m not sure if that is a related issue.

[powdahound]

Had this issue as well, though it was only showing up on iOS. Resolved it by adding a key prop to the highest level component to my Swipeable’s rightContent (a <View> in my case).

[martimarkov]

Check #3

As for the key prop, you either have to pass the key prop to your renderItem function:

          <Swipeable
            key={item.id}
           >
          {item.title}
          </Swipeable>
        )}

or implement keyExtractor for the FlatList:

_keyExtractor = (item, index) => item.id;

           <FlatList 
            keyExtractor={this._keyExtractor}
           ...

           </FlatList>