From 068459cc5febd473217dced9b1052acb63d2edb6 Mon Sep 17 00:00:00 2001
From: mtvpls <mtvpls@redaaa.ip-ddns.com>
Date: Fri, 27 Mar 2026 12:12:58 +0800
Subject: [PATCH] =?UTF-8?q?douban=E9=A1=B5=E9=9D=A2=E5=A4=A7=E5=B1=8F?=
 =?UTF-8?q?=E8=87=AA=E5=8A=A8=E9=A2=84=E5=8A=A0=E8=BD=BD=E7=AC=AC=E4=BA=8C?=
 =?UTF-8?q?=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/douban/page.tsx | 31 ++++++++++++++++++++++++++++++-
 1 file changed, 30 insertions(+), 1 deletion(-)

diff --git a/src/app/douban/page.tsx b/src/app/douban/page.tsx
index 2a4e8f0..b7d9ee5 100644
--- a/src/app/douban/page.tsx
+++ b/src/app/douban/page.tsx
@@ -30,6 +30,7 @@ function DoubanPageClient() {
   const [selectorsReady, setSelectorsReady] = useState(false);
   const observerRef = useRef<IntersectionObserver | null>(null);
   const loadingRef = useRef<HTMLDivElement>(null);
+  const contentRef = useRef<HTMLDivElement>(null);
   const debounceTimeoutRef = useRef<NodeJS.Timeout | null>(null);
 
   // 用于存储最新参数值的 refs
@@ -598,6 +599,34 @@ function DoubanPageClient() {
     };
   }, [hasMore, isLoadingMore, loading]);
 
+  // 首屏如果未被撑满，仅在第一页时额外请求一次下一页
+  useEffect(() => {
+    if (
+      loading ||
+      !selectorsReady ||
+      isLoadingMore ||
+      !hasMore ||
+      doubanData.length === 0 ||
+      currentPage !== 0
+    ) {
+      return;
+    }
+
+    const rafId = window.requestAnimationFrame(() => {
+      const contentEl = contentRef.current;
+      if (!contentEl) return;
+
+      const rect = contentEl.getBoundingClientRect();
+      const preloadThreshold = window.innerHeight + 120;
+
+      if (rect.bottom < preloadThreshold) {
+        setCurrentPage(1);
+      }
+    });
+
+    return () => window.cancelAnimationFrame(rafId);
+  }, [loading, selectorsReady, isLoadingMore, hasMore, doubanData.length, currentPage]);
+
   // 处理选择器变化
   const handlePrimaryChange = useCallback(
     (value: string) => {
@@ -781,7 +810,7 @@ function DoubanPageClient() {
         </div>
 
         {/* 内容展示区域 */}
-        <div className='max-w-[95%] mx-auto mt-8 overflow-visible'>
+        <div ref={contentRef} className='max-w-[95%] mx-auto mt-8 overflow-visible'>
           {/* 内容网格 */}
           <div className='justify-start grid grid-cols-3 gap-x-2 gap-y-12 px-0 sm:px-2 sm:grid-cols-[repeat(auto-fill,minmax(160px,1fr))] sm:gap-x-8 sm:gap-y-20'>
             {loading || !selectorsReady