【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,依然有眼前一亮的精妙之处。

相关推荐

  1. 网络安全导论知识要点

    2024-04-03 11:34:04       34 阅读
  2. ITIL服务管理知识要点梳理

    2024-04-03 11:34:04       21 阅读
  3. gitlab-ci相关部署踩坑及要点记录

    2024-04-03 11:34:04       25 阅读
  4. 数据库基础知识记录

    2024-04-03 11:34:04       23 阅读
  5. python知识记录

    2024-04-03 11:34:04       21 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-04-03 11:34:04       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-04-03 11:34:04       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-04-03 11:34:04       18 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-04-03 11:34:04       20 阅读

热门阅读

  1. Mini-React

    2024-04-03 11:34:04       16 阅读
  2. 数据库嵌套事务的实现

    2024-04-03 11:34:04       15 阅读
  3. 设计模式(15):迭代器模式

    2024-04-03 11:34:04       15 阅读
  4. 建造者模式:构建复杂对象的优雅之道

    2024-04-03 11:34:04       14 阅读
  5. 堆积排序算法C代码

    2024-04-03 11:34:04       14 阅读
  6. 5分钟安装docker和docker compose环境

    2024-04-03 11:34:04       15 阅读
  7. 微信小程序-语音输入(录音并播放)

    2024-04-03 11:34:04       17 阅读
  8. STC8H8K64U 学习笔记 - 位运算

    2024-04-03 11:34:04       14 阅读
  9. android 所有音量默认最大

    2024-04-03 11:34:04       11 阅读
  10. 小程序页面滚动?

    2024-04-03 11:34:04       13 阅读