From 302720ba18842297c7411bdf8e386969bbfe32d5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BC=A0=E6=88=90?= <light.zhang@ysinc.com>
Date: Sun, 9 Nov 2025 22:26:44 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=20=E9=AA=A8=E6=9E=B6?=
 =?UTF-8?q?=E5=B1=8F=20=E5=B0=8F=E4=BA=8E=E5=A4=9A=E5=B0=91ms=20=E4=B8=8D?=
 =?UTF-8?q?=E7=94=A8=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/container/listContainer/index.tsx | 33 ++++++++++++++++++++++++---
 1 file changed, 30 insertions(+), 3 deletions(-)

diff --git a/src/container/listContainer/index.tsx b/src/container/listContainer/index.tsx
index 28f5d1d..459acd5 100644
--- a/src/container/listContainer/index.tsx
+++ b/src/container/listContainer/index.tsx
@@ -28,8 +28,11 @@ const ListContainer = (props) => {
     defaultShowNum,
   } = props;
   const timerRef = useRef<NodeJS.Timeout | null>(null);
+  const loadingStartTimeRef = useRef<number | null>(null);
+  const skeletonTimerRef = useRef<NodeJS.Timeout | null>(null);
 
-  const [showNumber, setShowNumber] = useState(0)
+  const [showNumber, setShowNumber] = useState(0);
+  const [showSkeleton, setShowSkeleton] = useState(false);
 
   const userInfo = useUserInfo();
 
@@ -51,11 +54,35 @@ const ListContainer = (props) => {
       })
   }, [data])
 
+  // 控制骨架屏显示逻辑
+  useEffect(() => {
+    if (loading) {
+      // 开始加载时记录时间
+      loadingStartTimeRef.current = Date.now();
+      
+      // 延迟 300ms 后再显示骨架屏
+      skeletonTimerRef.current = setTimeout(() => {
+        setShowSkeleton(true);
+      }, 300);
+    } else {
+      // 加载完成，清除定时器并隐藏骨架屏
+      if (skeletonTimerRef.current) {
+        clearTimeout(skeletonTimerRef.current);
+        skeletonTimerRef.current = null;
+      }
+      setShowSkeleton(false);
+      loadingStartTimeRef.current = null;
+    }
+  }, [loading]);
+
   useEffect(() => {
     return () => {
       if (timerRef.current) {
         clearTimeout(timerRef.current);
       }
+      if (skeletonTimerRef.current) {
+        clearTimeout(skeletonTimerRef.current);
+      }
     };
   }, []);
 
@@ -130,8 +157,8 @@ const ListContainer = (props) => {
   return (
     <View className="listContentWrapper" style={style}>
       {renderList(data)}
-      {/* 显示骨架屏 */}
-      {loading && renderSkeleton()}
+      {/* 显示骨架屏 - 只有在 loading 超过 300ms 时才显示 */}
+      {loading && showSkeleton && renderSkeleton()}
       {/* <View className="recommendTextWrapper">
         <Text className="recommendText">搜索结果较少，已为你推荐其他内容</Text>
       </View>