Picovert

React 19 新特性:Actions、use() 和新的表单处理模式

2026-04-148 分钟阅读

React 19 是三年来第一个主要 React 版本。它发布的变更简化了最常见的痛点:表单状态、异步 变更、ref 转发和 context 消费。

Actions:异步变更的新模式

Actions 是处理表单提交和变更的异步函数。React 19 提供自动管理 Action 生命周期的 Hook。 Actions 替代的内容:手动的 isLoading/isError/data 状态、手动 try/catch、手动 e.preventDefault()

useActionState

useActionState Hook 包装 action 函数,提供 pending 状态和最后结果。

useOptimistic

useOptimistic 实现乐观 UI 更新——在实际请求进行时立即显示预期结果。 Action 解决(或拒绝)后,React 自动将乐观状态与真实数据对账。

use() Hook

use() Hook 在渲染中读取 context 或 Promise 的值。与 Hook 不同,它可以有条件 地调用。

ref 作为 prop

React 19 消除了 forwardRef 的需求。现在可以直接将 ref 作为 prop 传递。

Context 作为 JSX 元素

React 19 允许直接将 context 作为 JSX 元素使用,无需 .Provider 后缀。

迁移

React 19 移除了一些长期废弃的 API。运行 React 19 codemod:npx codemod@latest react/19/migration-recipe