【React】React知识要点记录

描述UI

万物皆组件

为什么多个 JSX 标签需要被一个父元素包裹?

切勿将数字放在 && 左侧

React 中为什么需要 key?

React 为何侧重于纯函数?

渲染树

模块依赖树

添加交互

React如何传递事件处理函数?

React 如何知道返回哪个 state


演示代码在这里code

React 应用中一次屏幕更新都会发生以下三个步骤

设置 state 会触发渲染


演示代码在这里code

渲染会及时生成一张快照

自己实现React批量更新state的状态队列


演示代码在这里code

为什么在 React 中不推荐直接修改 state?

状态管理

React如何强制重新渲染组件?

演示代码在这里code

React中useReducer的使用场景和案例


演示代码在这里code

React中使用 Context 进行深层数据传递


演示代码在这里code

使用 Reducer 和 Context 进行状态扩展


演示代码在这里code

参考

总结

React官网将React的实现细节揉碎了捏细了,再"喂"给初学者,讲的非常细致,建议细看教程,有问题再针对查阅。也许某些思路和片段即使是有几年经验的Reacter,依然有眼前一亮的精妙之处。

相关推荐
GalaxyPokemon1 小时前
LeetCode - 2. 两数相加
java·前端·javascript·算法·leetcode·职场和发展
你的人类朋友4 小时前
✍️【Node.js程序员】的数据库【索引优化】指南
前端·javascript·后端
小超爱编程5 小时前
纯前端做图片压缩
开发语言·前端·javascript
萌萌哒草头将军5 小时前
🚀🚀🚀什么?浏览器也能修改项目源文件了?Chrome 团队开源的超强 Vite 插件!🚀🚀🚀
vue.js·react.js·vite
islandzzzz6 小时前
HMTL+CSS+JS-新手小白循序渐进案例入门
前端·javascript·css·html
Senar6 小时前
网页中如何判断用户是否处于闲置状态
前端·javascript
很甜的西瓜6 小时前
typescript软渲染实现类似canvas的2d矢量图形引擎
前端·javascript·typescript·图形渲染·canvas
阿芯爱编程8 小时前
最长和谐子序列,滑动窗口
前端·javascript·面试
烛阴8 小时前
开发者神器:如何在浏览器控制台玩转第三方库,让调试效率翻倍!
前端·javascript
拉不动的猪9 小时前
JQ常规面试题
前端·javascript·面试