修复定位按钮无反应 + 增强高亮效果
- scrollIntoView 改用 requestAnimationFrame 确保 DOM 已更新 - 滚动位置改为 block: 'start',更可靠 - 高亮增加背景色变化(bg-press-wash/40),更明显 - 高亮持续时间延长至 5 秒 Co-Authored-By: new-provider/LongCat-2.0 <<EMAIL>> )
This commit is contained in:
@@ -75,9 +75,15 @@ export default function DataCompletenessPage() {
|
|||||||
// 点击问题项 → 滚动到对应联赛卡片并高亮
|
// 点击问题项 → 滚动到对应联赛卡片并高亮
|
||||||
const scrollToLeague = useCallback((code: string) => {
|
const scrollToLeague = useCallback((code: string) => {
|
||||||
setHighlightedLeague(code)
|
setHighlightedLeague(code)
|
||||||
leagueRefs.current[code]?.scrollIntoView({ behavior: 'smooth', block: 'center' })
|
// 使用 requestAnimationFrame 确保 DOM 已更新
|
||||||
// 3秒后移除高亮
|
requestAnimationFrame(() => {
|
||||||
setTimeout(() => setHighlightedLeague(null), 3000)
|
const el = leagueRefs.current[code]
|
||||||
|
if (el) {
|
||||||
|
el.scrollIntoView({ behavior: 'smooth', block: 'start' })
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// 5秒后移除高亮
|
||||||
|
setTimeout(() => setHighlightedLeague(null), 5000)
|
||||||
}, [])
|
}, [])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -167,7 +173,7 @@ export default function DataCompletenessPage() {
|
|||||||
<div
|
<div
|
||||||
key={league.code}
|
key={league.code}
|
||||||
ref={el => { leagueRefs.current[league.code] = el }}
|
ref={el => { leagueRefs.current[league.code] = el }}
|
||||||
className={`transition-all duration-500 ${isHighlighted ? 'ring-2 ring-press scale-[1.01]' : ''}`}
|
className={`transition-all duration-500 ${isHighlighted ? 'ring-2 ring-press bg-press-wash/40 scale-[1.01]' : ''}`}
|
||||||
>
|
>
|
||||||
<Card>
|
<Card>
|
||||||
<CardHeader
|
<CardHeader
|
||||||
|
|||||||
Reference in New Issue
Block a user