86张脑图，一口气看完 React，想学React的看过来，React知识图谱汇总

前言

React 18.0已经发布两周了

所以这两天抽空重新完整的过了一遍 React

我将所有内容整理为以下86张脑图，方便以后查阅

附原图和源文件：

原图和源文件（包括xmind和pos文件）已上传 github，如有需要可自行下载

86张脑图

1. 安装

2. 核心概念

JSX 简介

2.2元素渲染

2.3组件 & Props

2.4.1State & 生命周期

2.4.2数据流和正确使用State

2.5事件处理

2.6条件渲染

2.7列表 & Key

2.8表单

2.9状态提升

2.10组合 vs 继承

2.11React 哲学

3. 高级指引

3.1无障碍辅助功能

3.2代码分割

3.3.1Context

3.3.2Context API

3.4错误边界

3.5Refs 转发

3.6Fragments

3.7高阶组件

3.8.1集成带有 DOM 操作的插件

3.8.2与其他第三方库协同

3.9.1JSX 本质

3.9.2JSX 指定 React 元素类型

3.9.3JSX 中指定 props

3.9.4JSX 中的子元素

3.10.1性能优化之生产版本

3.10.2使用 Chrome Performance 标签分析组件

3.10.3使用开发者工具中的分析器对组件进行分析

3.10.4其他优化

3.11Portals

3.12Profiler API

3.13不使用 ES6

3.14不使用 JSX

3.15协调

3.16Refs & DOM

3.17Render Props

3.18.1静态类型检查之Flow

3.18.2静态类型检查之TypeScript

3.18.2静态类型检查之其他

3.19严格模式

3.20使用 PropTypes 进行类型检查

3.21非受控组件

3.22Web Components

4. API 参考

4.1.1React 顶层 API之概览

4.1.2React 顶层 API之参考

4.1.3React 顶层 API之参考2

4.2.1React.Component之概述

4.2.2常用的生命周期方法

4.2.3不常用的生命周期方法

4.2.4其他 API

4.2.5Class 属性和实例属性

4.3ReactDOM

4.4ReactDOMClient

4.5ReactDOMServer

4.6DOM 元素

4.7.1合成事件

4.7.2支持的事件

4.7.3支持的事件2

4.7.4支持的事件3

4.8Test Utilities

4.9Test Renderer

4.10JS 环境要求

4.11React 术语词

5. Hook

5.1Hook 简介

5.2Hook 概览

5.3使用 State Hook

5.4使用 Effect Hook

5.5Hook 规则

5.6自定义

5.7Hook API

5.8.1Hooks FAQ之采纳策略

5.8.2Hooks FAQ之从 Class 迁移到 Hook

5.8.3Hooks FAQ之性能优化

5.8.4Hooks FAQ之底层原理

6. 测试

6.1测试概览

6.2测试技巧

6.3测试环境

7. FAQ

7.1AJAX 及 APIs

7.2Babel，JSX 及构建过程

7.3传递函数给组件

7.4组件状态

7.5样式与 CSS

7.6项目文件结构

7.7Virtual DOM 及内核

86张脑图，一口气看完 React，想学React的看过来，React知识图谱汇总相关推荐

一张脑图看懂BUI Webapp移动快速开发框架【上】--框架与工具、资源
前言之前写过一篇 2018开发最快的Webapp框架--BUI交互框架 ,如果你还没看过,可以简单看一下,主要介绍了BUI的基本功能,有多少控件,以及实现的思路,BUI 1.5版本以后变化很大,统一 ...
我用 10 张脑图，征服了一系列大厂面试官。
我把自己以往的文章汇总成为了 Github ,欢迎各位大佬 star https://github.com/crisxuan/bestJavaer 已提交此篇文章秋招也快接近尾声了,我在秋招的结尾意 ...
搞懂这 10 张脑图后，我膨胀了。
点击蓝色"程序员cxuan "关注我哟加个"星标",欢迎来撩文:小菠萝编辑:cxuanhttps://github.com/crisxuan/bestJav ...
南京计算机审计行业工资,南京最新各行业平均工资曝光！看完分分钟想跳槽！...
原标题:南京最新各行业平均工资曝光!看完分分钟想跳槽! 工资是广大人民群众最关心的事情年年平均工资都在涨但小博似乎每年都是被平均的那个可不是,当我看了这份最近的南京冬季最新的平均工资艾玛,感 ...
android广告平台哪个好用,安卓手机里谁家系统广告最少？看完后想说：真怕小米MIUI垫底！...
原标题: 安卓手机里谁家系统广告最少?看完后想说:真怕小米MIUI垫底! 前天一篇文章评论中,有粉丝这样说: 可以看出这位粉丝真的十足小米粉!大师姐并非说小米不好哦,只是客观来说,小米家系统广告略微多 ...
看完我想说一句卧槽的“单例模式”
看完我想说一句卧槽的"单例模式" 单例模式是为了创建唯一个对象单例模式分为两种饿汉式懒汉式饿汉式 /*** 饿汉式* 特点:* 1.构造器私有* 2.一上来就new一个对象 ...
什么是数据库?数据库的作用想学数据库必看 (1)
1.DDL (Data Definition Language) 数据定义语言数据定义语言 , 用来定义数据库对象:库丶表丶列等; CREATE 丶 ALTER 丶 DROP2.DML (D ...
git 刷新远程分支列表_掌握Git命令一张脑图就行
最近在工作之余,遇到Git上面一些问题,趁这次的机会,补一补Git基础知识. 脑图本文更多梳理的是Git常用命令,非原理篇,需要这部分知识的可以往下看. 首先我们的了解Git通常的操作流程,网上流行 ...
成为一枚优秀的创业者，必须学会画的三张脑图
创业是创业者对自己拥有的资源或通过努力能够拥有的资源进行优化整合,从而创造出更大经济或社会价值的过程. 我们知道创业开始会遇到很多困难,很多难点,但是只要留心不忽略每个细节然后整理出来总有云开见天日. ...