Skip to content

Instantly share code, notes, and snippets.

@nodeEnthu
Created December 13, 2019 20:54
Show Gist options
  • Save nodeEnthu/60d23695aae59b9abd19972943cf54c8 to your computer and use it in GitHub Desktop.
Save nodeEnthu/60d23695aae59b9abd19972943cf54c8 to your computer and use it in GitHub Desktop.
callback for intersection observer
intersectionCallback(entries, observer) {
const self = this;
entries.forEach(entry => {
if(entry.isIntersecting) {
// append the current row in visible area
const divToAppendReactElement = document.createElement('div');
divToAppendReactElement.id = `dom${this.currentScrollPosition}`;
const newElement = ReactDOM.render(self.configureInsertedElement(), divToAppendReactElement);
const parentNode = entry.target.parentNode;
const target = document.getElementById(`end-sentinel${this.currentScrollPosition}`);
// append the element just before the sentinel
parentNode.insertBefore(newElement, target);
//unobserve the current seltinel
observer.unobserve(entry.target);
// set the new intersection observers
console.log(this.currentScrollPosition);
this.currentScrollPosition = this.currentScrollPosition + 1;
target.id = `end-sentinel${this.currentScrollPosition}`;
this.lazyLoadImageRow();
}
})
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment