react-infinite-loading

    1.0.0 • Public • Published

    react-infinite-loading

    npm npm npm Read the Docs

    mp4

    a react infinite scrolling component

    DEMO

    1. scroll element
    2. scroll window

    Installation

    react-infinite-loading requires React 15 or later.

    install --save-dev react-infinite-loading
    

    Usage

    after installation, can be used in of the code

    import Infinite from 'react-infinite-loading';
    
    <Infinite handleLoading={this.handleLoading} loading={this.state.loading}>
      {/* scrolled element */}
    </Infinite>
    

    Params

    here are some control parameters, used in the component's props

    Infinite.propTypes = {
      // control the current status. loading = true the animation is displayed and no longer triggers handleLoading event
      loading: PropTypes.bool,
      // whether to display the loading animation
      isLoading: PropTypes.bool,
      // load animation components
      asLoading: PropTypes.node,
      // if true, scroll range as a current component on the contrary scroll range as a window
      elementScroll: PropTypes.bool,
      // set the height of the scroll container, scrollHeight={300} or scrollHeight="calc(100% - 100px)"
      scrollHeight: PropTypes.any.isRequired,
      // trigger handleLoading event threshold
      scrollThreshold: PropTypes.num,
      // scroll to the bottom event
      handleLoading: PropTypes.func,
      // sisplayed content
      children: PropTypes.node
    };

    Test

    npm run test
    

    License

    MIT

    Install

    npm i react-infinite-loading

    DownloadsWeekly Downloads

    14

    Version

    1.0.0

    License

    MIT

    Last publish

    Collaborators

    • avatar