react-component-infinite-scroll

    0.1.6 • Public • Published

    Infinite Scroll React Component

    This is a simple React Component for a Infinite Scrolling Page.

    Nothing fancy, only a component that calls a passed function whenever a threshold from the bottom is reached.

    Getting Started

    Install react component:

    npm install --save react-component-infinite-scroll

    Import component in your file

    import InfiniteScroll from 'react-component-infinite-scroll';

    Use it in your component

    class PageableList extends React.Component {
      static propTypes = {
        actions: React.PropTypes.object
      };
    
      nextPage() {                  // whatever method you want InfiniteScroll to call
        this.props.actions.fetchImages();
      }
    
      render() {
        return (
          <InfiniteScroll nextPage={ this.nextPage.bind(this) } threshold={ 600 } >
            <div className="list">
              <h1 className="title">List</h1>
              <VerticalList { ...this.props } />
            </div>
          </InfiniteScroll>
        );
      }
    }
    

    InfiniteScroll component will call the method passed in the nextPage prop whenever it hits the threshold from the bottom of the page. Which means that if the method updates the state, it will re-render the Component.

    Install

    npm i react-component-infinite-scroll

    DownloadsWeekly Downloads

    1

    Version

    0.1.6

    License

    MIT

    Last publish

    Collaborators

    • apalzab
    • lmuntaner
    • wuakitv