Skip to content

Instantly share code, notes, and snippets.

@bdunn313
Created January 30, 2018 00:56
Show Gist options
  • Save bdunn313/6d4f33f54f827565ecac73785dbfd7d8 to your computer and use it in GitHub Desktop.
Save bdunn313/6d4f33f54f827565ecac73785dbfd7d8 to your computer and use it in GitHub Desktop.
// Reference: https://facebook.github.io/react-native/docs/flatlist.html
class MultiSelectList extends React.PureComponent {
state = {selected: (new Map(): Map<string, boolean>)};
_keyExtractor = (item, index) => item.id;
_onPressItem = (id: string) => {
// updater functions are preferred for transactional updates
this.setState((state) => {
// copy the map rather than modifying state.
const selected = new Map(state.selected);
selected.set(id, !selected.get(id)); // toggle
return {selected};
});
};
_renderItem = ({item}) => (
<MyListItem
id={item.id}
onPressItem={this._onPressItem}
selected={!!this.state.selected.get(item.id)}
title={item.title}
/>
);
render() {
return (
<FlatList
data={this.props.data}
extraData={this.state}
keyExtractor={this._keyExtractor}
renderItem={this._renderItem}
/>
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment