Updated scrollable list to improve infinite scoll

This commit is contained in:
mgabdev 2019-07-18 23:55:32 -04:00
parent db480928ec
commit 3ec39ee7c9

View File

@ -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();
} }