Updated scrollable list to improve infinite scoll
This commit is contained in:
parent
db480928ec
commit
3ec39ee7c9
@ -82,7 +82,7 @@ export default class ScrollableList extends PureComponent {
|
|||||||
|
|
||||||
componentDidMount () {
|
componentDidMount () {
|
||||||
this.window = window;
|
this.window = window;
|
||||||
this.documentElement = document.documentElement;
|
this.documentElement = document.scrollingElement || document.documentElement;
|
||||||
|
|
||||||
this.attachScrollListener();
|
this.attachScrollListener();
|
||||||
this.attachIntersectionObserver();
|
this.attachIntersectionObserver();
|
||||||
@ -124,10 +124,11 @@ export default class ScrollableList extends PureComponent {
|
|||||||
|
|
||||||
handleScroll = throttle(() => {
|
handleScroll = throttle(() => {
|
||||||
if (this.window) {
|
if (this.window) {
|
||||||
const { scrollTop, scrollHeight, clientHeight } = this.documentElement;
|
const { scrollTop, scrollHeight } = this.documentElement;
|
||||||
const offset = scrollHeight - scrollTop - clientHeight;
|
const { innerHeight } = this.window;
|
||||||
|
const offset = scrollHeight - scrollTop - innerHeight;
|
||||||
|
|
||||||
if (600 > offset && this.props.onLoadMore && this.props.hasMore && !this.props.isLoading) {
|
if (400 > offset && this.props.onLoadMore && this.props.hasMore && !this.props.isLoading) {
|
||||||
this.props.onLoadMore();
|
this.props.onLoadMore();
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -174,6 +175,7 @@ export default class ScrollableList extends PureComponent {
|
|||||||
|
|
||||||
componentWillUnmount () {
|
componentWillUnmount () {
|
||||||
this.clearMouseIdleTimer();
|
this.clearMouseIdleTimer();
|
||||||
|
this.detachScrollListener();
|
||||||
this.detachIntersectionObserver();
|
this.detachIntersectionObserver();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user