SuperAPI AI 工具集

react

前端与建站

查看项目

更新于 10-15 19:54

技能介绍

用途:这是一套 React 18/19 的团队内部约定,用于指导正在编写或修改的组件,不要求为符合约定而重构未改动的文件。

主要能力与要点:默认使用 Server Component,仅在需要状态、副作用、事件处理或浏览器 API 时加 'use client',并尽量把边界下移到组件树深处,因为边界之上的组件也会发送到浏览器;跨边界传递的 props 必须可序列化,函数、类实例或含 Date 的对象会在运行时而非构建时报错。在生命周期长于渲染的逻辑(定时器、订阅、防抖回调)中应使用函数式更新,如 setCount(c => c + 1),避免闭包捕获旧值。useEffect 只用于与 React 外部同步,数据转换放渲染、派生值用普通变量、事件响应放处理器;每个启动副作用的 effect 都要返回清理函数,Strict Mode 的双调用正是暴露缺失清理的信号。列表 key 必须是稳定标识而非索引。memo、useMemo、useCallback 需有可衡量的理由再使用。状态放在自然层级,全局客户端状态用 Zustand,服务端状态用 TanStack Query。为可独立失败的单元加错误边界,为需要回退 UI 的位置加 Suspense 边界。React 19 中可用 useActionState、<form action>、useOptimistic、use(),ref 已是普通 prop,无需 forwardRef;useFormStatus 只报告其上方表单,提交按钮需单独组件嵌套在 form 内。输入触发昂贵计算时用 useTransition。优先语义化 HTML,ARIA 仅作补充。测试按 role 和 label 查询,如 getByRole('button', { name: /submit/i }),testId 仅作无无障碍名称元素的兜底。

限制:资料未提供安装命令、版本要求、收费或平台信息。