点击下载——[完结16章]React18内核探秘:手写React高质量源码迈向高阶开发 提取码: 8epr
手写 React 高质量源码,迈向高阶开发 React18内核探秘:手写React高质量源码迈向高阶开发
batching 批处理,说的是,可以将回调函数中多个 setState 事件合并为一次渲染,因此是异步的。
解决的问题是多次同值、不同值 setState, 期望最后显示的是最后一次 setState 的结果,减少渲染。
const Index = () => { const [name, setName] = useState('') const [age, setAge] = useState(0)
const change = () => {
setName('a')
setAge(1)
// 仅触发一次渲染,批处理,2次setState合并为一次渲染
// 需需要立即重渲染,需要手动调用
// ReactDOM.flushSync(() => {
// setName('a') // 立即执行渲染
// setAge(1) // 立即执行渲染
// // 不会合并处理,即没有批处理,触发2次
// });
}
console.log(1) // 只打印一次
return (
<div>
<p>name: {name}</p>
<p>age: {age}</p>
<button onClick={change}>更改</button>
</div>
)
}
- React 18是什么? 在我们讨论“React 18有什么新功能”之前,React 18 是什么意思?任何 18.0.0 以上但不包括 19.0.0 的 React 库的稳定版本都被称为 React 18。
React 18 的创建在 React 应用程序中引入了并发渲染。React 一直在关注 DOM 渲染,并为开发人员提供控制和跟踪组件生命周期的工具。有了一些新功能,React 18 现在可以调整渲染过程,以适应客户端设备。
现在终于等到了 React 18,所以我打算好好看看新版本的这些特性,到底香不香
标签:const,渲染,18,16,React,源码,setState From: https://blog.51cto.com/u_16204320/7772235