Rerendering FlatList with extraData
React Native FlatList is a PureComponent, and it will not rerender its items if you're making shallow changes to the props. The same applies to the state variable the list-item depends.
So what can you do?
Yes, extraData is there to rescue!!!
You can pass any depended variable outside the data property to the marker prop extraData.
eg:
// adapted from reactnative.dev/docs/flatlist
const [selectedId, setSelectedId] = useState(null);
const items = [
{
id: "some-unique-id",
title: "Item 1"
}
];
// will have some logic based on selectedIdconst
renderItem = ({ item }) => {
return(.....);
}
<FlatList
data={DATA}
renderItem={renderItem}
keyExtractor={(item) => item.id}extraData={selectedId}
/>