React v19 正式发布

• Actions：

  • useActionState Hook：接受一个函数（Action），返回包装后的 Action 供调用，调用时返回结果和等待状态，用于简化常见的 Actions 场景处理。

  • useOptimistic Hook：在执行数据变更的异步请求时，以乐观方式展示最终状态，更新完成或出错后自动切换回原值，优化用户界面反馈。

  • <form> Actions 集成：在 react-dom 中，支持将函数作为 <form>、<input> 和 <button> 元素的相关属性传递，实现自动提交表单，成功时自动重置不受控组件表单，也可手动调用 requestFormReset API 重置。

  • useFormStatus Hook：方便编写设计组件获取所处 <form> 表单信息，无需层层传递 props，可像读取 Context 提供者状态一样读取表单状态。

  • use API：用于在渲染时读取资源，可读取 Promise 并让 React 挂起直至其解析，也能读取 Context，且可条件性调用。

• 新的 React DOM 静态 API：prerender 和 prerenderToNodeStream 用于静态网站生成，改进 renderToString 功能，会等待数据加载后生成静态 HTML，适配 Node.js Streams 和 Web Streams 等流环境。

• React Server Components：提供在独立于客户端应用或 SSR 服务器环境中提前渲染组件的新选择，相关库可将 React 19 作为对等依赖，应用于支持全栈 React 架构的框架。

• ref 作为 prop：现在可以在函数组件中直接使用 ref 作为 prop。

• 水合错误改进：改进了客户端渲染和服务端渲染之间的水合错误报告。

• <Context> 作为提供者：可以直接使用 <Context> 作为提供者，而不是 <Context.Provider>。

参考：

https://react.dev/blog/2024/12/05/react-19