fix: add unmount cancellation guard, simplify keyExtractor, update spec

app/index.tsx

@@ -99,10 +99,10 @@ export default function HomeScreen() {
       <Animated.FlatList
         style={styles.listContainer}
         data={rows}
-        keyExtractor={(row: any, index) =>
+        keyExtractor={(row: any) =>
           row.type === 'big'
             ? `big-${row.item.bvid}`
-            : `pair-${row.left.bvid}-${row.right?.bvid ?? 'empty'}-${index}`
+            : `pair-${row.left.bvid}-${row.right?.bvid ?? 'empty'}`
         }
         contentContainerStyle={{
           paddingTop: insets.top + NAV_H + 6,

components/BigVideoCard.tsx

@@ -45,7 +45,7 @@ export function BigVideoCard({ item, isVisible, onPress }: Props) {
   // Fetch play URL when visible for the first time
   useEffect(() => {
     if (!isVisible || videoUrl) return;
-
+    let cancelled = false;
     (async () => {
       try {
         // cid may be missing from feed items; fetch detail if needed
@@ -54,25 +54,25 @@ export function BigVideoCard({ item, isVisible, onPress }: Props) {
           const detail = await getVideoDetail(item.bvid);
           cid = detail.cid ?? detail.pages?.[0]?.cid;
         }
-        if (!cid) return;
-
+        if (!cid || cancelled) return;
         const playData = await getPlayUrl(item.bvid, cid, 16);
-
+        if (cancelled) return;
         if (playData.dash) {
-          setIsDash(true);
+          if (!cancelled) setIsDash(true);
           try {
             const mpdUri = await buildDashMpdUri(playData, 16);
-            setVideoUrl(mpdUri);
+            if (!cancelled) setVideoUrl(mpdUri);
           } catch {
-            setVideoUrl(playData.dash.video[0]?.baseUrl);
+            if (!cancelled) setVideoUrl(playData.dash.video[0]?.baseUrl);
           }
         } else {
-          setVideoUrl(playData.durl?.[0]?.url);
+          if (!cancelled) setVideoUrl(playData.durl?.[0]?.url);
         }
       } catch (e) {
         console.warn('BigVideoCard: failed to load play URL', e);
       }
     })();
+    return () => { cancelled = true; };
     // videoUrl intentionally excluded — re-fetch guard prevents redundant fetches after URL is set
   }, [isVisible, item.bvid]);
 

docs/superpowers/specs/2026-03-11-big-video-card-design.md

@@ -53,7 +53,7 @@ interface BigVideoCardProps {
 ```
 BigVideoCard (TouchableOpacity)
 ├── 封面图 (Image, 16:9 全宽)
-├── 视频播放器 (NativeVideoPlayer, position: absolute, isVisible 时加载)
+├── 视频播放器 (react-native-video <Video>, position: absolute, isVisible 时加载；直接使用 <Video> 而非 NativeVideoPlayer，因为不需要控制条/热力图等全功能组件)
 │   └── muted, autoplay, qn=16
 ├── 封面遮罩 (Animated.View, opacity 1→0 淡出)
 └── 底部信息栏