From d64a8758b492661f1e5c85f76bbaa8acf049c8ee Mon Sep 17 00:00:00 2001
From: Vixalie <vixalie@outlook.com>
Date: Thu, 7 Aug 2025 22:26:01 +0800
Subject: [PATCH] =?UTF-8?q?perf(components):=20=E4=BC=98=E5=8C=96=20Scroll?=
 =?UTF-8?q?Bar=20=E7=BB=84=E4=BB=B6=E6=80=A7=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 将 createMemo 改为 createEffect，减少不必要的计算
- 优化 thumbPos 计算逻辑，提高滚动性能
- 调整 setIsDragging 调用方式，确保正确更新状态
---
 src/components/ScrollArea.tsx | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/components/ScrollArea.tsx b/src/components/ScrollArea.tsx
index 899d8d4..51474c4 100644
--- a/src/components/ScrollArea.tsx
+++ b/src/components/ScrollArea.tsx
@@ -2,6 +2,7 @@ import cx from 'clsx';
 import { clamp } from 'es-toolkit';
 import {
   Component,
+  createEffect,
   createMemo,
   createSignal,
   JSX,
@@ -27,9 +28,9 @@ const ScrollBar: Component<ScrollBarProps> = (props) => {
   const [thumbPos, setThumbPos] = createSignal(0);
   const [isDragging, setIsDragging] = createSignal(false);
 
-  const thumbPos = createMemo(() => {
+  createEffect(() => {
     if (props.scrollMax <= 0) {
-      return 0;
+      setThumbPos(0);
     }
 
     const scrollPercent = props.scrollPos / props.scrollMax;
@@ -37,10 +38,11 @@ const ScrollBar: Component<ScrollBarProps> = (props) => {
     const trackSize = props.axis === 'y' ? track.clientHeight : track.clientWidth;
 
     if (trackSize < thumbSize) {
-      return 0;
+      setThumbPos(0);
     }
 
-    return scrollPercent * (trackSize - thumbSize);
+    const pos = scrollPercent * (trackSize - thumbSize);
+    setThumbPos(pos);
   });
   const thumbStyle = createMemo(() => ({
     [props.axis === 'y' ? 'top' : 'left']: `${thumbPos()}px`,