Have ideas to improve npm?Join in the discussion! »

    smatob-infinite-scroll-pagination

    1.0.4 • Public • Published

    This package will use for infinite scroll pagination in react.

    Installation

    npm install smatob-infinite-scroll-pagination
    

    usage

    const callback = () =>{
        //fetch data
    }
    
    <InfiniteScrollPagination callback={callback} isVisible={true} loader="Loading...">
        // show fetch data
    </InfiniteScrollPagination>
    
    

    Usage

    • callback() : This is a function for fetch more data from API/function.
    • isVisible : This will be set true/false. False it will stop the pagination. True continue scrolling with data
    • loader : Thi is loading indicator. You can pass any type of loader (image/css/text).

    Example

    import React, { useState } from 'react';
    import InfiniteScrollPagination from 'smatob-infinite-scroll-pagination';
    
    function App() {
        //set limit and its value
        const [no, setNo] = useState(0);
    
        // set data for showing result
        const [state, setstate] = useState('');
    
        let listItem = '';
    
        //callback function for fetch data (it can also use API call )
        const callback = () => {
            if (no <= 5) {
                listItem = [...Array(40).keys()].map((list) => {
                    return <li key={list}>Item {no * 40 + list}</li>;
                });
    
                setNo((previousNo) => previousNo + 1);
                setstate((previousState) => [...previousState, listItem]);
            }
        };
    
        return (
            <div
                style={{
                    width: '300px',
                    border: '1px solid #ccc',
                    margin: 'auto',
                }}
            >
                <InfiniteScrollPagination
                    callback={callback}
                    isVisible={no <= 5}
                    loader="Loading..."
                >
                    <ul>{state}</ul>
                </InfiniteScrollPagination>
            </div>
        );
    }
    
    export default App;
    
    

    Install

    npm i smatob-infinite-scroll-pagination

    DownloadsWeekly Downloads

    4

    Version

    1.0.4

    License

    ISC

    Unpacked Size

    9.71 kB

    Total Files

    5

    Last publish

    Collaborators

    • avatar