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

相关推荐
计算机-秋大田2 分钟前
基于微信小程序的校园失物招领系统设计与实现(LW+源码+讲解)
java·前端·后端·微信小程序·小程序·课程设计
林涧泣12 分钟前
【Uniapp-Vue3】下拉刷新
前端·vue.js·uni-app
浪遏19 分钟前
Langchain.js | Memory | LLM 也有记忆😋😋😋
前端·llm·aigc
luoganttcc1 小时前
华为升腾算子开发(一) helloword
java·前端·华为
九月十九2 小时前
AviatorScript用法
java·服务器·前端
Jane - UTS 数据传输系统2 小时前
VUE+ Element-plus , el-tree 修改默认左侧三角图标,并使没有子级的那一项不展示图标
javascript·vue.js·elementui
_.Switch3 小时前
Python Web开发:使用FastAPI构建视频流媒体平台
开发语言·前端·python·微服务·架构·fastapi·媒体
菜鸟阿康学习编程3 小时前
JavaWeb 学习笔记 XML 和 Json 篇 | 020
xml·java·前端
索然无味io4 小时前
XML外部实体注入--漏洞利用
xml·前端·笔记·学习·web安全·网络安全·php
ThomasChan1234 小时前
Typescript 多个泛型参数详细解读
前端·javascript·vue.js·typescript·vue·reactjs·js