@ied/react-infinite-scroll

5.0.3 • Public • Published

Live

@ied/react-infinite-scroll

The best react infinite scroll component, on earth 🌍

Usage

Install
yarn add @ied/react-infinite-scroll
How to
import React from 'react'
import InfiniteScroll from '@ied/react-infinite-scroll'

const Component = (props) => {

  const infiniteActions = {
    loadMore,
  }

  const infiniteState = {
    hasMore,
    loading,
    error,
  }

  const infiniteCustoms = {
    spinner: <CustomSpinner />,
    reloader: <CustomReloader />,
  }

  const infiniteOptions = {
    threshold: 100,
  }

  const infiniteStyle = {
    height: 300,
  }

  return (
    <InfiniteScroll
      actions={infiniteActions}
      state={infiniteState}
      customs={infiniteCustoms}
      options={infiniteOptions}
      style={infiniteStyle}
    >
     {items.map((item, index) => <Item item={item} key={index} />)}
    </InfiniteScroll>
  )
}
PropTypes
  InfiniteScroll.propTypes = {
    children: React.PropTypes.node,
    style: React.PropTypes.shape({}),
    options: React.PropTypes.shape({
      threshold: React.PropTypes.number,
    }),
    actions: React.PropTypes.shape({
      loadMore: React.PropTypes.func.isRequired,
    }).isRequired,
    state: React.PropTypes.shape({
      hasMore: React.PropTypes.bool.isRequired,
      loading: React.PropTypes.bool.isRequired,
      error: React.PropTypes.bool.isRequired,
    }).isRequired,
    customs: React.PropTypes.shape({
      spinner: React.PropTypes.node,
      reloader: React.PropTypes.node,
    }),
  }

Package Sidebar

Install

npm i @ied/react-infinite-scroll

Weekly Downloads

0

Version

5.0.3

License

MIT

Last publish

Collaborators