From fbab805610325a87f310407fe642e160d7a178c7 Mon Sep 17 00:00:00 2001 From: yml2213 Date: Sun, 4 Oct 2026 14:52:05 +0800 Subject: [PATCH] =?UTF-8?q?fix(ui):=20=E4=BF=AE=E6=8E=89=20LoginTasksPage?= =?UTF-8?q?=20=E7=9A=84=20hooks=20=E9=A1=BA=E5=BA=8F=E5=91=8A=E8=AD=A6?= =?UTF-8?q?=EF=BC=88eslint=20=E7=94=B1=E7=BA=A2=E8=BD=AC=E7=BB=BF=EF=BC=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit `setTaskSummary` 在 useEffect 里被使用（约 259 行），但它的 useState 声明在 约 420 行 —— eslint `react-hooks/immutability` 判为「访问了尚未声明的变量」。 这是 main 上就存在的历史问题，会让 `npm run lint` 失败。 **运行时其实不会踩 TDZ**（useEffect 在渲染后执行、且内部是 async，等到真正调用 setter 时声明早已执行完），但**声明与使用相隔 160 行**本身就是隐患：任何一次 把调用改成同步、或把 effect 往上移的重构都会真的炸。 处理：把 useState 声明移到任务相关 state 区块（taskPage / taskStatus / taskTotal 旁边）—— 既满足规则，也让这组状态聚在一起。先确认过**组件在声明之前没有任何 早期 return**，所以上移不会改变 hooks 的调用顺序。 验证： - `npx eslint src/pages/LoginTasksPage.tsx` → 0 errors（原本 1 error） - `npm run lint` → **exit 0**（29 个 warning 是既有的 react-refresh 提示，未动） - `npm run build`（tsc -b && vite build）通过 --- web/frontend/src/pages/LoginTasksPage.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/web/frontend/src/pages/LoginTasksPage.tsx b/web/frontend/src/pages/LoginTasksPage.tsx index acb86e7..1d97306 100644 --- a/web/frontend/src/pages/LoginTasksPage.tsx +++ b/web/frontend/src/pages/LoginTasksPage.tsx @@ -99,6 +99,9 @@ export default function LoginTasksPage() { }); const [taskStatus, setTaskStatus] = useState(''); const [taskTotal, setTaskTotal] = useState(0); + // 全局统计走 /tasks/summary：分页后 tasks 只是当前页， + // 用它算「成功/失败」会和「共 N 个任务」对不上（曾显示「共 8508，成功 48」）。 + const [taskSummary, setTaskSummary] = useState(null); useEffect(() => { localStorage.setItem('login_task_page_size', String(taskPageSize)); }, [taskPageSize]); const { logs, connected: wsConnected, connect: connectLogs } = useWebSocketLogs(); const { can } = usePermissions(); @@ -415,9 +418,6 @@ export default function LoginTasksPage() { setSelectedRowKeys([]); }; - // 全局统计走 /tasks/summary：分页后 tasks 只是当前页， - // 用它算「成功/失败」会和「共 N 个任务」对不上（曾显示「共 8508，成功 48」）。 - const [taskSummary, setTaskSummary] = useState(null); const successCount = taskSummary?.success ?? 0; const failedCount = taskSummary?.failed ?? 0; const checkedCount = tasks.filter((t) => [