React是用于渲染用户界面（UI）的JavaScript库。 UI是由按钮，文本和图像等小型单元构建的。 React使您可以将它们结合到可重复使用的可嵌套组件中。从网站到电话应用程序，屏幕上的所有内容都可以分解为组件。在本章中，您将学习创建，自定义和有条件地显示React组件。
反应18个功能
内置的反应钩
钩子可让您使用组件中的不同反应功能。您可以使用内置钩子或组合它们来构建自己的钩子。此页面列出了React中的所有内置挂钩。
状态钩
状态让组件记住诸如用户输入之类的信息。例如，表单组件可以使用状态存储输入值，而图像库组件可以使用状态存储所选图像索引。
要将状态添加到组件中，请使用以下钩子之一：
usestate
声明您可以直接更新的状态变量。用户ducer
在还原函数中声明具有更新逻辑的状态变量。
上下文钩
上下文使组件可以从遥远的父母那里接收信息，而无需将其作为道具传递。例如，您的应用程序的顶级组件可以将当前的UI主题传递给以下所有组件，无论多么深。
usecontext
阅读并订阅上下文。
ref钩
Refs让组件包含一些用于渲染的信息，例如DOM节点或超时ID。与状态不同，更新REF不会重新渲染您的组件。裁判是反应范式的逃生舱口。当您需要使用非反应系统（例如内置浏览器API）时，它们很有用。
useref
宣布参考。您可以保留其中的任何值，但通常用来容纳DOM节点。使用刺激性手机
让您自定义组件揭露的裁判。这很少使用。
效果钩
效果让组件与外部系统连接并同步。这包括处理网络，浏览器DOM，动画，使用其他UI库编写的小部件以及其他非反应代码。
效应是反应范式的逃生孵化。不使用效果来协调应用程序的数据流。如果您不与外部系统进行交互，则可能不需要效果。
有两个很少使用的使用效率变化，并且时间差异很大：
uselayouteffect
在浏览器重新粉刷屏幕之前发射。您可以在这里测量布局。使用insertioneffect
反应之前的火对DOM进行更改。库可以在此处插入动态CS。
性能钩
优化重新渲染性能的一种常见方法是跳过不必要的工作。例如，您可以告诉REACT以自上述渲染以来数据没有更改，请重复使用缓存的计算或跳过重新渲染。
要跳过计算和不必要的重新渲染，请使用以下钩子之一：
usememo
让您缓存昂贵的计算结果。usecallback
使您可以在将函数定义转移到优化的组件之前缓存一个函数定义。
有时，您可以跳过重新渲染，因为屏幕实际上需要更新。在这种情况下，您可以通过分开必须同步的阻止更新（例如输入输入）与非阻止更新的更新来提高性能，这些更新不需要阻止用户界面（例如更新图表）。
要确定渲染的优先级，请使用以下钩子之一：
用户术
让您将状态过渡标记为非阻滞，并允许其他更新中断。使用了EferredValue
让您推迟更新UI的非关键部分，并让其他部分首先更新。
其他钩子
这些钩子对图书馆作者大多有用，并且在应用程序代码中常用。使用ebugvalue
让您可以自定义定制挂钩的标签React DevTools显示。使用
让组件将独特的ID与自己关联。通常与可访问性API一起使用。使用yncexternalstortor
让组件订阅外部商店。