Package Exports
- react-load-more-hook
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-load-more-hook) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
React Load More Hook
This is a react hook for loading more content on scroll to bottom of an element or window.
Setup Instructions
- With React installed, add
react-load-more
dependency to your project.$ npm install react-load-more-hook
Usage
Import the library in the file you want to use it
import { useloadMore } from 'react-load-more-hook';
Create a reference to the container that will trigger the load more when it is scrolled to the bottom
const { ref } = useRef(null)
// Add load more hook here
return (<ul ref={ref}>
...
</ul>)
Instantiate your load more hook here
const [isLoadingMore, setIsLoadingMore] = useloadMore(callback , ref)
Args | Type | Default | Description |
---|---|---|---|
callback | Function | This is the function you want the hook to call when the element/window is scrolled to the bottom. | |
ref | React useRef | null | This is the reference to the container element. |
isLoadingMore
is true
when the container with the window scroll has reached the bottom of the container with the ref
.
Also you need to manually call setIsLoadingMore(false)
to tell the hook to notify you of the next scroll to bottom because there is no way the hook can know when you have updated the views or when your async
call has been completed.
TLDR;
Cheers, I hope you like what you see.