diff --git a/src/components/RepositoryCard.tsx b/src/components/RepositoryCard.tsx index aeade326..933942f3 100644 --- a/src/components/RepositoryCard.tsx +++ b/src/components/RepositoryCard.tsx @@ -686,6 +686,14 @@ const RepositoryCardComponent: React.FC = ({ // 使用 ref 来跟踪是否已经处理了点击 const isProcessingClickRef = useRef(false); + const hideDescriptionTooltip = useCallback(() => { + if (tooltipHideTimerRef.current) { + clearTimeout(tooltipHideTimerRef.current); + tooltipHideTimerRef.current = null; + } + setShowTooltip(false); + }, []); + // 使用 useCallback 优化事件处理函数 const handleCardClick = useCallback((event: React.MouseEvent) => { // 防止重复处理 @@ -726,9 +734,10 @@ const RepositoryCardComponent: React.FC = ({ return; } - // 打开 README 模态框 + // 打开 README 模态框前隐藏描述悬浮提示,避免遮挡预览层 + hideDescriptionTooltip(); setReadmeModalOpen(true); - }, [selectionMode, onSelect, repository.id]); + }, [selectionMode, onSelect, repository.id, hideDescriptionTooltip]); // 处理鼠标按下事件,阻止焦点变化导致页面滚动 const handleMouseDown = useCallback((event: React.MouseEvent) => { @@ -749,12 +758,14 @@ const RepositoryCardComponent: React.FC = ({ if (event.key === 'Enter' || event.key === ' ') { event.preventDefault(); if (selectionMode && onSelect) { + hideDescriptionTooltip(); onSelect(repository.id); } else { + hideDescriptionTooltip(); setReadmeModalOpen(true); } } - }, [selectionMode, onSelect, repository.id, isModalOpen]); + }, [selectionMode, onSelect, repository.id, isModalOpen, hideDescriptionTooltip]); // 使用 useMemo 缓存卡片类名,避免重复计算 const cardClassName = useMemo(() => { diff --git a/src/components/SubscriptionRepoCard.tsx b/src/components/SubscriptionRepoCard.tsx index d2992773..b6b38fe9 100644 --- a/src/components/SubscriptionRepoCard.tsx +++ b/src/components/SubscriptionRepoCard.tsx @@ -65,6 +65,19 @@ export const SubscriptionRepoCard: React.FC = ({ repo if (aiHideTimerRef.current) clearTimeout(aiHideTimerRef.current); }, []); + const hideFloatingTooltips = useCallback(() => { + if (descHideTimerRef.current) { + clearTimeout(descHideTimerRef.current); + descHideTimerRef.current = null; + } + if (aiHideTimerRef.current) { + clearTimeout(aiHideTimerRef.current); + aiHideTimerRef.current = null; + } + setDescTooltip(false); + setAiTooltip(false); + }, []); + const abortControllerRef = useRef(null); useEffect(() => { @@ -314,8 +327,9 @@ export const SubscriptionRepoCard: React.FC = ({ repo // 点击卡片打开 README const handleCardClick = useCallback(() => { + hideFloatingTooltips(); setReadmeModalOpen(true); - }, []); + }, [hideFloatingTooltips]); const cardTitle = repo.full_name || `${repo.owner?.login || ''}/${repo.name || ''}`;