atTop, atBottom events

[dragos-boisteanu]

trafficstars

I could not find any event that will notify me when the scroll has reached the top or the bottom. This is helpfull for loading more data when scrolling up or down. Is it possible to have these events ? Maybe even with an offset how farther away the scroll is from the realt bottom/top the events should be fired ?

[radiancelux]

I created a method that is triggered by the child component which emits the id of the object being rendered, this function refreshed the data in the object that the dynamic scroller is currently iterating through, I set it to trigger my pagination load more logic when the rerendered object is the 15th from the bottom of the feed array. `// Add a new variable to keep track of the last "trigger" post let lastTriggerPostId = null;

async function renderUpdate({ parentItemId, parentPostId, grandparentPostId, rootPostId, }) { // Start the batch timer if it hasn't been started yet startBatchTimer();

// Enqueue the parentItemId if it exists if (parentItemId) { parentItemQueue.push(parentItemId); }

if (parentItemId) { // Check if this is the 'trigger' post that's 15th from the bottom of the array const triggerIndex = feed.value.length - 15; const triggerPost = feed.value[triggerIndex];

if (
  triggerPost &&
  parentItemId === triggerPost.id &&
  parentItemId !== lastTriggerPostId
) {
  lastTriggerPostId = parentItemId; // Update the last "trigger" post

  loadMorePosts(); // Load more posts
}

// Enqueue the view counts
const viewCount = [parentItemId, parentPostId, grandparentPostId, rootPostId].filter(
  Boolean
);
viewCountQueue.push(...viewCount);

// Additional fetching if needed for parent
if (parentPostId) {
  const updatedParent = await postStore.fetchPostsByIds([parentPostId]);
  if (updatedParent) {
    if (parentPosts.value) {
      // Check if it's undefined
      parentPosts.value[parentPostId] = updatedParent;
    } else {
      console.error("parentPosts.value is undefined");
    }
    viewCount.push(parentPostId);
  }
}

// Additional fetching if needed for grandparent
if (grandparentPostId) {
  const updatedGrandparent = await postStore.fetchPostsByIds([grandparentPostId]);
  if (updatedGrandparent) {
    grandparentPosts.value[grandparentPostId] = updatedGrandparent;
  }
}

// Additional fetching if needed for root
if (rootPostId) {
  const updatedRoot = await postStore.fetchPostsByIds([rootPostId]);
  if (updatedRoot) {
    rootPosts.value[rootPostId] = updatedRoot;
  }
}

} }`