组件之间复用状态逻辑很难，在hooks之前，实现组件复用，一般采用高阶组件和 Render Props，它们本质是将复用逻辑提升到父组件中，很容易产生很多包装组件，带来嵌套地域。
Refs 提供了一种访问在render方法中创建的 DOM 节点或者 React 元素的方法。在典型的数据流中，props 是父子组件交互的唯一方式，想要修改子组件，需要使用新的pros重新渲染它。凡事有例外，某些情况下咱们需要在典型数据流外，强制修改子代，这个时候可以使用 Refs。
总结： 类组件可以维护自身的状态变量，即组件的 state ，类组件还有不同的生命周期方法，可以让开发者能够在组件的不同阶段（挂载、更新、卸载），对组件做更多的控制。类组件则既可以充当无状态组件，也可以充当有状态组件。当一个类组件不需要管理自身状态时，也可称为无状态组件。
React 16.8中正式发布了React Hooks，主要是想解决如何复用一个有状态的组件的问题。实际上React Hooks就是一系列特殊的函数，可以让本来无状态的函数组件变成有状态的，在组件内部hook组件的状态state和lifecycle。不过在正式总结React Hooks前，有必要搞清楚一些比较基本的问题，例如：什么是组件，什么是有状态组件和无状态组件，它们各自有什么特点，如何创建组件。本文根据这一思路将梳理关于React组件的基本内容，具体包括：
每个React组件强制要求必须有一个 render()。它返回一个 React 元素，是原生 DOM 组件的表示。如果需要渲染多个 HTML 元素，则必须将它们组合在一个封闭标记内，例如 <form>、<group>、 等。此函数必须保持纯净，即必须每次调用时都返回相同的结果。02
虚拟 DOM (VDOM)是真实 DOM 在内存中的表示。UI 的表示形式保存在内存中，并与实际的 DOM 同步。这是一个发生在渲染函数被调用和元素在屏幕上显示之间的步骤，整个过程被称为调和。
React.forwardRef 会创建一个React组件，这个组件能够将其接受的 ref 属性转发到其组件树下的另一个组件中。这种技术并不常见，但在以下两种场景中特别有用：
相同点： 组件是 React 可复用的最小代码片段，它们会返回要在页面中渲染的 React 元素。也正因为组件是 React 的最小编码单位，所以无论是函数组件还是类组件，在使用方式和最终呈现效果上都是完全一致的。
以下问题选自各国企央企面试题以及本人招人过程中涉及到比较多的题目，删除了一些比较基本以及偏门的一些问题，如果可以100%掌握，相信可以找到一份不错的工作！Good Luck！
组件状态数据或者属性数据发生更新的时候，组件会进入存在期，视图会渲染更新。在生命周期方法 should ComponentUpdate中，允许选择退出某些组件（和它们的子组件）的和解过程。
React是流行的javascript框架之一，在2019年及以后将会更加流行。React于2013年首次发布，多年来广受欢迎。它是一个声明性的、基于组件的、用于构建用户界面的高效javascript库。
props 更新流程： 相对于 state 更新，props 更新后唯一的区别是增加了对 componentWillReceiveProps 的调用。关于 componentWillReceiveProps，需要知道这些事情：
正如 我们的React教程第一部分 【点击直达】中所指出的，开始使用 React 相对容易。首先使用 Create React App（CRA）初始化一个新项目，然后开始开发。不过遗憾的是，随着时间的推移，代码可能会变得难以维护，特别是在你不熟悉 React 的情况下。组件有可能会变大，或者你可能最终得到一堆不是组件的组件，最终你可能会到处编写重复的代码。
增加dangerouslySetInnerHTML属性，并且传入对象的属性名叫_html
setState 是 React 中最常用的命令，通常情况下，执行 setState 会触发 render。但是这里有个点值得关注，执行 setState 的时候不一定会重新渲染。当 setState 传入 null 时，并不会触发 render。
（2）区别 Redux更多的是遵循Flux模式的一种实现，是一个 JavaScript库，它关注点主要是以下几方面∶
shouldcomponentUpdate pureCompoment setState
useRef 还可以传入一个初始值，这个值会保存在 ref.current 中，上面代码中，如果不给 div 元素传递 ref={divRef}，则 divRef.current 的值将是我们传入的初始值。
复合组件模式是一种通过将多个简单组件组合在一起创建更复杂组件的方法。这种模式使得组件的逻辑分离，每个简单组件负责特定的功能。通过复合组件，可以轻松构建可复用的、功能完备的组件。
下面了的代码，我们用到了数组函数的map方法来实现数组的每一个值变成它的2倍，同时返回一个新数组，最后打印出了这个数组：
React Hooks 是在函数式组件中使用的生命周期方法，React Hooks 在 React 16.8 中被引入。在类组件中的生命周期方法已被合并成 React Hooks，React Hooks 无法在类组件中使用。
两者都是呈现 HTML 表单元素的 React 组件。这意味着，每当您创建具有 HTML 表单的组件时，您都会创建两个组件中的任何一个。但是两者之间的显着差异，接下来我们来我们来详细介绍它们。
大家好，又见面了，我是你们的朋友全栈君。 Hi 各位，欢迎来到 React 回忆录！? 在上一章中，我介绍了使用 React 渲染界面元素的方法，以及在这个过程中蕴含的“组件化”想想。在本章中，我们将
用于构建用户界面的 Javascript 库，它主要专注于界面与视图。采用组件化模式、声明式编码，提高开发效率及组件复用率。在React Native中可以使用React语法进行移动端开发。使用虚拟DOM+优秀的Diffing算法，尽量减少与真实DOM的交互。
在 React源码中，当具体到某一事件处理函数将要调用时，将调用 invokeGuardedCallback方法。
驼峰式命名法（Camel Case），也叫小驼峰式命名法（Lower Camel Case）
例子中使用map方法将每个元素的值*2，最后得到的数组为：[2, 4, 6, 8, 10]。在React中，处理组件数组的方式与之类似。
React的受控组件与非受控组件的概念是相对于表单而言的，在React中表单元素通常会持有一下内部的state，因此它的工作方式与其他HTML元素不一样，而获取表单元素内部state的实现方式的不同，就产生了受控组件和非受控组件。
当调用 setState时， React做的第一件事是将传递给setState的对象合并到组件的当前状态，这将启动一个称为和解（ reconciliation）的过程。
只需要保证，在同一个数组中的兄弟元素之间的 key 是唯一的。而不需要在整个应用程序甚至单个组件中保持唯一。
你可以使用属性初始值设定项(property initializers)来正确绑定回调，create-react-app 也是默认支持的。在回调中你可以使用箭头函数，但问题是每次组件渲染时都会创建一个新的回调。
3.我们编码时基本只需要操作react的虚拟DOM相关数据, react会转换为真实DOM变化而更新界。
React Hooks 是一个闪亮的新提案，将优化 90% 的 React 代码。 根据 Dan Abramov 的说法，Hooks 是 React 的未来。
当应用程序在开发模式下运行时，React 将自动检查咱们在组件上设置的所有 props，以确保它们具有正确的数据类型。对于不正确的类型，开发模式下会在控制台中生成警告消息，而在生产模式中由于性能影响而禁用它。强制的 props 用 isRequired定义的。
React PowerPlug 是利用 render props 进行更好状态管理的工具库。
作为一个合格的React开发者，它的生命周期是我们必须得了解的，本文将会以下几个方面介绍React生命周期：
React 是前端三大框架之一,在面试和开发中也是一项技能; 本文从实际开发中总结了 React 开发的一些技巧技巧,适合 React 初学或者有一定项目经验的同学; 万字长文,建议收藏。 序列文章:Vue 开发必须知道的 36 个技巧【近1W字】
上线了不到 5 天，没有任何推文介绍的情况下，销量已经超过 400，这个是我万万没想到的，不过这也侧面反映了各位掘友对我的信任。在后台大概看了一下 ID 名单，其中不乏熟悉的面孔，但更多的是几乎没什么印象甚至完全陌生的 ID，确实，回头看看在掘金这些日子的成长，写作、思考和挣扎的过程是极其痛苦的，但正是因为你偶然看到了文章，不经意点了赞、给了一些反馈，才让我有足够的斗志和毅力坚持下去。可能我们从未谋面，甚至互相连微信都没有，但就偏偏在一个叫"掘金"的地方，我收到了来自一个陌生人的认可，这种感觉从未有过，也是一直激励我不断坚持的动力。各位无论是期待已久还是偶尔打开这篇文章，请让我非常真诚地说上一声: 非常感谢！
原理:子组件里面利用 props 获取父组件方法直接调用,从而改变父组件的值 注意: 此方法和 props 大同小异,都是 props 的应用,所以在源码中没有举例
以 store 为核心，可以把它看成数据存储中心，但是他要更改数据的时候不能直接修改，数据修改更新的角色由Reducers来担任，store只做存储，中间人，当Reducers的更新完成以后会通过store的订阅来通知react component，组件把新的状态重新获取渲染，组件中也能主动发送action，创建action后这个动作是不会执行的，所以要dispatch这个action，让store通过reducers去做更新React Component 就是react的每个组件。
在React项目中，通过redux存储全局数据时，会有一个问题，如果用户刷新了网页，那么通过redux存储的全局数据就会被全部清空，比如登录信息等。这时就会有全局数据持久化存储的需求。首先想到的就是localStorage，localStorage是没有时间限制的数据存储，可以通过它来实现数据的持久化存储。
Refs 提供了一种方式，用于访问在 render 方法中创建的 React 元素或 DOM 节点。Refs 应该谨慎使用，如下场景使用 Refs 比较适合：
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM
