/react-scroll-down

React scroll down to load data.Support ie9+

Primary LanguageJavaScriptMIT LicenseMIT

react-scroll-down

NPM Version Build Status Coverage Status

React scroll down to load data. Support ie9+

Install

yarn

yarn add react-scroll-down

npm

npm install --save react-scroll-down

UMD

<script src="https://unpkg.com/react-scroll-down@0.1.4/dist/index.umd.js"></script>

OR

<script src="https://unpkg.com/react-scroll-down@0.1.4/dist/index.umd.min.js"></script>

Tips: You can find the library on window.ReactScrollDown.

Import

ES2015

import ReactScrollDown from 'react-scroll-down'

CommonJS

const ReactScrollDown = require('react-scroll-down')

Usage

import ReactScrollDown from 'react-scroll-down'

function Example() {
  return (
    <ReactScrollDown
      elementDomId="layoutContentContainer"
      onBottomHeightChange={(height) => {
        if (height !== undefined && height < 100) {
          // do something
        }
      }}
    >
      {/** List only children or Null */}
    </ReactScrollDown>
  )
}

Tips: The elementDomId must have a scrolling style.(case: overflow: auto; height: 100%). The elementDomId can't include child nodes with (overflow: auto; height: 100%) style.

Params

elementDomId: Type string, isRequired. scrolling element id

onBottomHeightChange: Type (height: number|undefined) => void. scrolling listen event returns height from bottom after execution

LICENSE

MIT License