SuperAPI AI 工具集

react-19

前端与建站

查看项目

更新于 10-15 23:41

技能介绍

用途:为编写 React 19 组件提供模式与约束,配合 React Compiler 自动优化。

主要能力与规则:

  1. 禁止手动 memoization。React Compiler 自动处理优化,不要使用 useMemo/useCallback 包裹过滤、排序或事件处理函数。
  2. 导入必须用具名导入,如 import { useState, useEffect, useRef } from 'react';禁止 import React from 'react' 或 import * as React from 'react'。
  3. 服务端组件优先:默认写服务端组件,不加指令;仅在需要 useState、useEffect、useRef、useContext、事件处理器或浏览器 API(window、localStorage)时加 "use client"。
  4. use() 钩子:可读取 promise(挂起直到 resolve),也可在条件分支中读取 context,这是 useContext 做不到的。
  5. ref 作为 prop:React 19 中 ref 就是普通 prop,无需 forwardRef。
  6. 本项目表单约定:使用领域 hook 编排表单的 Server Actions,要求 React Hook Form、zodResolver 以及每个表单专用的 Zod schema;不要用 useActionState 或直接 <form action={...}> 提交来管理表单状态。

适用场景:在采用 React 19 与 React Compiler 的项目中编写组件、处理数据获取与交互、实现表单。

限制:资料未提供安装命令、版本要求、收费信息或平台支持范围;上述规则为该项目模板的约定,其他项目未必适用。