xueteng/video-flow-b
1
0
Fork 0
forked from 77media/video-flow
Code Pull Requests Activity

修复缩略图区域 自动滚动偏差问题

Browse Source
This commit is contained in:
北枳 2025-08-26 00:18:15 +08:00
parent 2dc7c5e616
commit f9c1a70b8f
1 changed files with 12 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
components/pages/work-flow/thumbnail-grid.tsx
View File

@ -30,14 +30,20 @@ export function ThumbnailGrid({
useEffect(() => { useEffect(() => {
if (thumbnailsRef.current) { if (thumbnailsRef.current) {
const container = thumbnailsRef.current; const container = thumbnailsRef.current;
const thumbnailWidth = container.offsetWidth / 4; // 每个缩略图宽度（包含间距） const thumbnails = container.children;
const scrollPosition = currentSketchIndex * thumbnailWidth;
if (currentSketchIndex >= 0 && currentSketchIndex < thumbnails.length) {
const thumbnail = thumbnails[currentSketchIndex] as HTMLElement;
const containerLeft = container.getBoundingClientRect().left;
const thumbnailLeft = thumbnail.getBoundingClientRect().left;
const scrollPosition = container.scrollLeft + (thumbnailLeft - containerLeft);
container.scrollTo({ container.scrollTo({
left: scrollPosition, left: scrollPosition,
behavior: 'smooth' behavior: 'smooth'
}); });
} }
}
}, [currentSketchIndex]); }, [currentSketchIndex]);
// 获取当前阶段的数据数组 // 获取当前阶段的数据数组