|
|
@ -40,23 +40,8 @@ export default class InfiniteScroll extends Vue { |
|
|
|
|
|
|
|
@Emit("reached-bottom") |
|
|
|
handleIntersection(entries: IntersectionObserverEntry[]) { |
|
|
|
console.log("handleIntersection"); |
|
|
|
const entry = entries[0]; |
|
|
|
if (entry.isIntersecting) { |
|
|
|
const distance = entry.boundingClientRect.top - entry.rootBounds.top; |
|
|
|
console.log("distance: ", distance); |
|
|
|
console.log("intersectionRatio", entry.intersectionRatio); |
|
|
|
const sentinelPosition = ( |
|
|
|
this.$refs.sentinel as HTMLElement |
|
|
|
).getBoundingClientRect(); |
|
|
|
// Access sentinel element's position properties |
|
|
|
const sentinelTop = sentinelPosition.top; |
|
|
|
console.log("sentinelTop", sentinelTop); |
|
|
|
const scrollContainer = ( |
|
|
|
this.$refs.scrollContainer as HTMLElement |
|
|
|
).getBoundingClientRect(); |
|
|
|
// Access scrollContainer properties or perform any necessary actions |
|
|
|
console.log("scrollContainerTop", scrollContainer); |
|
|
|
return true; |
|
|
|
} |
|
|
|
return false; |
|
|
|