https://github.com/dozsolti/react-native-use-list
React Native library of easy solutions for common List use cases.
https://github.com/dozsolti/react-native-use-list
flatlist sectionlist virtualizedlist
Last synced: 11 months ago
JSON representation
React Native library of easy solutions for common List use cases.
- Host: GitHub
- URL: https://github.com/dozsolti/react-native-use-list
- Owner: dozsolti
- License: mit
- Created: 2023-04-17T08:03:45.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2023-04-28T11:39:31.000Z (about 3 years ago)
- Last Synced: 2025-06-14T11:42:10.439Z (about 1 year ago)
- Topics: flatlist, sectionlist, virtualizedlist
- Language: TypeScript
- Homepage:
- Size: 431 KB
- Stars: 38
- Watchers: 1
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
## Features
- :open_book: Pagination
- Navigate to next or previous page.
- Go to a specific page (via index).
- Page looping
- Item alignment
- :repeat: Pull to Refresh
- isRefreshing state
- :bulb: _Open for more. Request a feature in the issues tab._
## Supported components
- FlatList
- VirtualizedList
- SectionList
## Installation
Using npm:
```sh
npm install --save react-native-use-list
```
Using yarn:
```sh
yarn add react-native-use-list
```
## Quickstart - Pagination
```js
import { useList } from 'react-native-use-list';
const ref = useRef(null);
const { pageIndex, nextPage, prevPage, indexController } = useList({ ref });
return (
<>
{pageIndex}
>
);
```
## Quickstart - Pull to refresh
```js
import { useList } from 'react-native-use-list';
const [data, setData] = useState([...]);
const updateData = async () => {
...
setData([...])
}
const { isRefreshing, refreshController } = useList({
onRefresh: updateData // <---
});
return (
<>
isRefreshing: {isRefreshing}
>
);
```
## Folders
```
/example/examples
/Flatlist
Pagination.tsx
AdvancedPagination.tsx
PullToRefresh.tsx
/VirtualizedList
Pagination.tsx
PullToRefresh.tsx
/SectionList
Pagination.tsx
PullToRefresh.tsx
/example/templates (coming soon)
```
## Contributing
See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
## License
MIT
---
Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)