fix: preserve continuous drawer and heart exit animations

2026-10-08 16:12:33 +08:00
parent c0b752da3a
commit 2c7b81981c
2 changed files with 4 additions and 3 deletions
@@ -48,7 +48,7 @@ export function VideoCard({ item, position, active, muted, playing, reaction, co
      }} />
    <div className="scene-copy" aria-hidden="true"><span>{item.label}</span><strong>{item.subtitle}</strong><i>THE LITTLE THINGS. THE BIG FEELINGS.</i></div>
    {active && !playing && !failed && <span className="paused"><Play size={58} fill="currentColor" /></span>}
-    {hearts.map(heart => <span key={heart.id} className="heart-burst" style={{ left: heart.x, top: heart.y }} onAnimationEnd={() => setHearts(previous => previous.filter(h => h.id !== heart.id))}><Heart size={112} fill="currentColor" /><i /><i /><i /><i /></span>)}
+    {hearts.map(heart => <span key={heart.id} className="heart-burst" style={{ left: heart.x, top: heart.y }} onAnimationEnd={event => { if (event.target === event.currentTarget) setHearts(previous => previous.filter(h => h.id !== heart.id)); }}><Heart size={112} fill="currentColor" /><i /><i /><i /><i /></span>)}
    {failed && <div className="video-error">视频暂时无法加载<button onClick={() => { setFailed(false); video.current?.load(); setPlaying(true); }}>重新加载</button></div>}
    <div className="video-info"><span className="location"><MapPin size={13} />{item.location}<span>·</span>精选风景</span>
      <h2>@{item.author}<span className="verified"><Check size={11} /></span></h2>