nachoaIvarez / react-native-scrollable-list

A ListView without the boilerplate.

react-native-scrollable-list

A ListView without the boilerplate.

Install

npm install --save react-native-scrollable-list

Usage

import 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.

Props

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.

License

MIT © Nacho Álvarez