react-infinite-intersection
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.5 • Public • Published

    react-infinite-intersection

    Made with create-react-library

    NPM JavaScript Style Guide


    Description

    This is a project that implements an infinite scroll component using the intersectionObserver API.


    Install

    npm install --save react-infinite-intersection

    Demo


    Usage

    import React, { useState, useEffect, useCallback, useRef } from 'react';
    import InfiniteIntersection from 'react-infinite-intersection';
    
    const App = () => {
      // your code ...
    
      return (
        <>
          <h2>React Infinite Intersection Componenet Example</h2>
          <div id="app" ref={appRef}>
            <InfiniteIntersection
              callback={intersection observer callback}
              root={intersection observer root option}
              rootMargin={intersection observer root option}
              threshold={intersection observer threshold option}
              element={container element tag type}
              style={container element tag style}
              ref={intersection component ref}
            >
              {
                children.map(child => <ReactImage key={child} />)
              }
            </InfiniteIntersection>
          </div>
        </>
      );
    }

    intersection observer unobserve

    const intersectionRef = useRef<HTMLButtonElement>(null);
    
    // unobserve
    intersectionRef.current.unobserve();
    
    <InfiniteIntersection
      ref={intersection component ref}
    >



    License

    MIT © [Luffy Yeon](https://github.com/Luffy Yeon)

    Install

    npm i react-infinite-intersection

    DownloadsWeekly Downloads

    3

    Version

    1.0.5

    License

    MIT

    Unpacked Size

    21.3 kB

    Total Files

    11

    Last publish

    Collaborators

    • avatar