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 静态 APIprerenderprerenderToNodeStream 用于静态网站生成,改进 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

相关推荐
excel27 分钟前
JavaScript 字符串与模板字面量:从表象到本质理解
前端
京东云开发者1 小时前
当AI成为导演-如何用AI创作动漫短剧
前端
李白的天不白1 小时前
使用 SmartAdmin 进行前后端开发
java·前端
乘风gg1 小时前
🤡PUA AI Coding 工具 的 10 条终极语录
前端·ai编程·claude
学Linux的语莫2 小时前
Vue 3 入门教程
前端·javascript·vue.js
怕浪猫2 小时前
第一章、Chrome DevTools Protocol (CDP) 详解
前端·javascript·chrome
kyriewen2 小时前
从本地到生产:迁移到 GitHub Actions 自动化 CI/CD,总结了这 5 个坑
前端·github·自动化运维
雨季mo浅忆2 小时前
首个Vue3项目边写边学边记
前端·vue3
IT_陈寒3 小时前
React中useEffect依赖项这个坑我居然踩了三天
前端·人工智能·后端
qq4356947014 小时前
Vue04
前端·vue.js