https://github.com/srph/react-infinite-scroll
A simple infinite scroll React.js component
https://github.com/srph/react-infinite-scroll
react react-component
Last synced: about 2 months ago
JSON representation
A simple infinite scroll React.js component
- Host: GitHub
- URL: https://github.com/srph/react-infinite-scroll
- Owner: srph
- License: mit
- Created: 2016-10-08T13:55:56.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2016-10-09T14:59:51.000Z (over 9 years ago)
- Last Synced: 2025-02-27T20:14:23.762Z (over 1 year ago)
- Topics: react, react-component
- Language: JavaScript
- Homepage: http://srph.github.io/react-infinite-scroll
- Size: 368 KB
- Stars: 2
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
- License: LICENSE
Awesome Lists containing this project
README
# react-infinite-scroll [](https://www.npmjs.com/package/@srph/react-infinite-scroll)
```bash
npm i @srph/react-infinite-scroll
```
A simple infinite scroll React.js component.
## Why
- I was a bit frustrated with the existing libraries, so I went to come up with a simpler API.
- I'd like to keep this library simple -- if you're looking for more advanced features and performant implementations, please check [react-virtualized](https://github.com/bvaughn/react-virtualized) and [react-infinity](https://github.com/nmn/react-infinity).
## Usage
```js
{this.state.items((item, i) =>
{item.name}
)}
```
## API
|Prop|Description|Type|
|-----|-----|-----|
|callback|The callback to be ran when we reach the offset|`function` (required)|
|disabled|Flag to run callback once we reach the offset|`boolean` (default: `false`)|
|offset|Allowance before reaching the offset|`number` (default: `250`)|
|container|Flag if we're using the window (`false`) or this `div` (requires to be scrollable)|`boolean` (default: `false`)|
|reverse|Trigger callback when we reach the top instead of the bottom. Useful for chat applications.|`boolean` (default: `false`)|
## Examples
You can check the [demo](https://srph.github.io/react-infinite-scroll), or build it yourself:
```
npm run install
npm run example:run
```