diff --git a/src/views/Home.vue b/src/views/Home.vue index c2a6dd7..de32ceb 100644 --- a/src/views/Home.vue +++ b/src/views/Home.vue @@ -450,9 +450,12 @@ async function loadEvents(page: number, append: boolean, keyword?: string) { pageSize: eventPageSize.value, }) - nextTick(() => { - - }) + // 首屏/刷新后:若未占满可视区域且还有数据,再自动加载一页 + if (!append) { + nextTick(() => { + fillViewportIfNeeded() + }) + } } catch (e) { console.log(e) if (!append) eventList.value = [] @@ -480,6 +483,21 @@ function getMainScrollEl(): Element | null { return document.querySelector('[data-main-scroll]') } +/** 内容未撑满滚动容器可视高度时返回 true */ +function isContentShorterThanViewport(): boolean { + const el = getMainScrollEl() + if (el) { + return el.scrollHeight <= el.clientHeight + SCROLL_LOAD_THRESHOLD + } + return document.documentElement.scrollHeight <= window.innerHeight + SCROLL_LOAD_THRESHOLD +} + +/** 首屏加载后若未占满屏幕且还有更多数据,再触发一次 loadMore */ +function fillViewportIfNeeded() { + if (loadingMore.value || eventList.value.length === 0 || noMoreEvents.value) return + if (isContentShorterThanViewport()) loadMore() +} + function checkScrollLoad() { if (loadingMore.value || eventList.value.length === 0 || noMoreEvents.value) return const el = getMainScrollEl()