endless-scrollable
Installation
yarn add endless-scrollable
or
npm install endless-scrollable --save
Usage
Clones ComponentToCopy infinitely:
const List = () => {
return (
<EndlessScrollable item={ComponentToCopy} />
)
}More practical example:
const List = () => {
const [page, setPage] = useState(1);
/**
* ComponentToCopy will get {page}
* which can be used to fetch some more data out of ComponentToCopy
*/
return (
<EndlessScrollable item={ComponentToCopy} itemProps={{ page, setPage }} />
)
}Props
| Name | Type | Required | Description |
|---|---|---|---|
| item | React.ComponentType<IItem> |
true | Component's props must implement IITem interface |
| itemProps | IItemProps |
false | interface IItemProps { [prop: string]: any; } |
| intersectionOptions | object |
false | https://github.com/thebuilder/react-intersection-observer#options |
| className | string |
false | wrapper's classname |
More examples in storybook
Clone repo
cd endless-scrollable/
yarn install
yarn storybook