Next.js 的 Server Actions 是什么?怎么用?

Server Actions 是运行在服务端的异步函数,可在表单提交/交互中直接修改数据(如写库),无需手写 API 路由。在 App Router 中通过 'use server' 指令声明。

// app/actions.ts
'use server'
export async function createTodo(formData: FormData) {
  await db.todo.create({ title: formData.get('title') })
  revalidatePath('/todos')   // 重新验证缓存
}

// app/page.tsx
<form action={createTodo}>
  <input name="title" />
  <button type="submit">添加</button>
</form>

优点:减少前后端样板、天然支持流式/渐进增强、与服务端状态无缝。

也可内联:async function action() { 'use server'; ... }。注意不要在客户端泄露敏感逻辑。

同分类其他题目