Skip to content

Instantly share code, notes, and snippets.

@divyanshu013
Created February 19, 2018 13:25
Show Gist options
  • Save divyanshu013/a84fd7f1bd1a413e39fa746a66d31ff1 to your computer and use it in GitHub Desktop.
Save divyanshu013/a84fd7f1bd1a413e39fa746a66d31ff1 to your computer and use it in GitHub Desktop.
Rendering a FlatList from ReactiveList
...
import { ScrollView, StyleSheet, StatusBar, FlatList, Text } from 'react-native';
import CONSTANTS from '../constants';
...
export default class TodosContainer extends React.Component {
...
onAllData = (todos, streamData) => {
// filter data based on "screen": [All | Active | Completed]
const filteredData = this.filterTodosData(todos);
return (
<FlatList
style={{ width: '100%', top: 15 }}
data={filteredData}
keyExtractor={item => item._id}
renderItem={({ item: todo }) => (
<Text>{todo.title}</Text>
)}
/>
);
};
filterTodosData = (todosData) => {
const { screen } = this.props;
switch (screen) {
case CONSTANTS.ALL:
return todosData;
case CONSTANTS.ACTIVE:
return todosData.filter(todo => !todo.completed);
case CONSTANTS.COMPLETED:
return todosData.filter(todo => todo.completed);
}
return todosData;
};
render() {
...
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment