Local demo:
git clone https://github.com/rechat/react-scroll-detector.git
cd react-scroll-detector
npm i && npm start
npm i react-scroll-detector --save
import React from 'react'
import ReactScrollDetector from 'react-scroll-detector'
class App extends React.Component {
handleScrollBottom() {
console.log('On Scroll Bottom')
}
handleScrollTop() {
console.log('On Scroll Top')
}
render() {
return (
<ReactScrollDetector
debounceTime={500}
accuracy={90}
onScrollBottom={this.handleScrollBottom}
onScrollTop={this.handleScrollTop}
>
<div style={{ minHeight: '500px', maxHeight: '500px', overflow: 'auto' }}>
...
</div>
</ReactScrollDetector>
)
}
}| Prop | Type | Description | Default |
|---|---|---|---|
| onScrollBottom | Function | Triggers when scroll reaches bottom | (top) => {} |
| onScrollTop | Function | Triggers when scroll reaches top | (top) => {} |
| accuracy | Number | Accuracy of detection | 90 |
| debounceTime | Number | D etection debounce time in milli seconds | 500 |
MIT