/use-infinite-scroll

A custom hook for infinite scrolling in React.

Primary LanguageTypeScript

use-infinite-scroll

GitHub GitHub package.json version

A custom hook for implementing infinite scrolling in React applications.

Table of Contents

Installation

You can install use-infinite-scroll using npm or yarn:

npm install @mikexrmn/use-infinite-scroll

# OR

yarn add @mikexrmn/use-infinite-scroll

Usage

import React from "react";
import useInfiniteScroll from "@mikexrmn/use-infinite-scroll";

function MyComponent() {
  const fetchData = async (page) => {
    // Replace this with your data fetching logic
  };

  const { data, loading } = useInfiniteScroll(fetchData);

  return <div>{/_ Render your data and loading indicator here _/}</div>;
}

export default MyComponent;

API Reference

useInfiniteScroll(fetchDataFunction: (page: number) => Promise<any[]>): InfiniteScrollResult

Parameters

  • fetchDataFunction: A function that fetches data based on the current page number.

Returns

An object with the following properties:

  • data: An array of data items.
  • loading: A boolean indicating whether data is currently being loaded.

InfiniteScrollResult

An object with the following properties:

  • data: An array of data items.
  • loading: A boolean indicating whether data is currently being loaded.

Contributing

Contributions are welcome! Feel free to open issues and pull requests.

License

This project is licensed under the MIT License.