fix(ui): 修掉 LoginTasksPage 的 hooks 顺序告警(eslint 由红转绿)
`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)通过
This commit is contained in:
@@ -99,6 +99,9 @@ export default function LoginTasksPage() {
|
||||
});
|
||||
const [taskStatus, setTaskStatus] = useState<string>('');
|
||||
const [taskTotal, setTaskTotal] = useState(0);
|
||||
// 全局统计走 /tasks/summary:分页后 tasks 只是当前页,
|
||||
// 用它算「成功/失败」会和「共 N 个任务」对不上(曾显示「共 8508,成功 48」)。
|
||||
const [taskSummary, setTaskSummary] = useState<TaskSummary | null>(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<TaskSummary | null>(null);
|
||||
const successCount = taskSummary?.success ?? 0;
|
||||
const failedCount = taskSummary?.failed ?? 0;
|
||||
const checkedCount = tasks.filter((t) => [
|
||||
|
||||
Reference in New Issue
Block a user