A ListView without the boilerplate.
npm install --save react-native-scrollable-listimport ScrollableList from 'react-native-scrollable-list'
// other imports
const celebrities = [
{
name: 'Leonardo Di Caprio',
role: 'Actor',
},
{
name: 'Luís Suárez',
role: 'Football Player',
},
{
name: 'Eddie Van Halen',
role: 'Guitar Player',
},
]
const Celebrity = ({name, role}) => (<Text>Name: {name}{'\n'}Role: {role}</Text>)
export default (<ScrollableList data={celebrities} renderRow={(data) => <Celebrity {...data} />} />)That's it.
That will render a ListView, with all the dataSource, cloneWithRows, and all that boilerplate code nobody wants to write. And, when data changes, updates dataSource gracefully, without forcing re-rendering.
First, check ListView's props. ScrollableList is compliant. If you want to pass any of the ListView props (like style, onEndReached, onChangeVisibleRows, etc), just pass them to ScrollableList, and they will reach ListView.
MIT © Nacho Álvarez