SuperAPI AI 工具集

nextjs-server-actions

前端与建站

查看项目

更新于 10-15 23:41

技能介绍

用途:面向 Next.js 15.5/16 的 Server Actions 系统技能,用于服务端数据变更,如无需 API 路由的表单提交、数据库增删改、服务端文件上传、乐观更新与表单校验错误展示。

主要能力:定义 Server Action(组件内联 'use server' 或独立 actions 文件顶部 'use server');原生表单集成 <form action={serverAction}>;用 action.bind(null, id) 绑定额外参数;Hook 包括 react 的 useActionState(表单状态与 pending)、react-dom 的 useFormStatus(子组件 pending 状态)、react 的 useOptimistic(乐观 UI);用 revalidatePath('/posts') 按路径、revalidateTag('posts') 按标签重新验证,redirect('/success') 在变更后跳转;支持 Zod 校验、鉴权(auth、unauthorized、forbidden)、try-catch 错误处理、文件上传(fs/promises 写入 public/uploads)。

使用方式:在组件或独立文件中以 'use server' 声明操作,表单直接传入 action,客户端组件配合 useActionState/useFormStatus/useOptimistic 处理状态与乐观更新;非表单场景可在按钮点击或事件处理器中调用。

适用场景:表单提交、数据库变更、文件上传、乐观更新、表单校验与错误展示。相关技能:数据获取见 nextjs-data-fetching,缓存与重新验证见 nextjs-caching,操作中的鉴权见 nextjs-authentication。

限制:资料未提供安装命令、收费、价格、平台与效果信息;具体实现依赖项目自身的数据库、鉴权与存储配置。