React Hook to call an action if an intersected element was reached
npm install react-use-infinite-scroll-hook!Create Release Workflow !Release
React Hook to call an action if an intersected element was reached
- [Node][node]
- [pnpm][pnpm]
``bash
pnpm install react-use-infinite-scroll-hook
Usage
typescript jsx
import { useInfiniteScroll } from 'react-use-infinite-scroll-hook';const fetchMoreData = async () => {
const response = await fetch('https://dummyjson.com/products')
return await response.json()
}
export const MyComponent = ({ data }) => {
const scrollElementRef = useInfiniteScroll(fetchMoreData)
return (
{
data.map(({ id, title }) => (
${title}
))
}
)
}
`💻 Setup (on your machine)
bash
Check out the main-branch of this repository and switch into this directory
git clone git@github.com:tscharke/react-use-infinite-scroll-hook.git && cd "$(basename "$_" .git)"Install all dependencies
pnpm installBuild module
pnpm run buildOptional
Run tests
pnpm run testRun linter
pnpm run lint
``Many thanks to [Denise Schaefer][denise] for here [useIntersection-Hook][intersection], on which this React Hook based.
[node]: https://nodejs.org/api/corepack.html
[pnpm]: https://pnpm.io
[denise]: https://github.com/denise-schaefer
[intersection]: https://github.com/denise-schaefer/useIntersection