挂钩如何更换组件？

Question

据我了解，

Hooks只是向function组件添加状态（和生命周期方法）的一种方式。

此常见问题解答：

从长远来看，我们希望Hooks成为人们编写React组件的主要方式。
https://reactjs.org/docs/hooks-faq.html#should-i-use-hooks-classes-or-a-mix-of-both

和此文档摘要：

挂钩可让您根据相关的部分将一个组件拆分为较小的功能
https://reactjs.org/docs/hooks-intro.html

作为React的初学者让我有些困惑。

好像我必须根据 hooks 而不是 elements 和 components 来考虑我的应用。

React并未删除组件，但引号暗示了挂钩将替换 组件是代码重用的主要来源。

人们还能谈论元素和组件作为React中的主要抽象吗？

写成钩子的一段代码可能是比组件更可重用的对象，但对我来说，不如元素和组件直观。

Answer 1

组件的概念并没有消失，只是组件的编写方式正在发生变化。

您引用的第二行

通过钩子，您可以根据相关的部分将一个组件拆分为较小的功能

我认为措辞不佳，应该说“挂钩让您将一个类组件拆分为较小的功能组件 ...”

因此，您不必像在componentDidMount，componentDidUpdate这样的方法中拥有一个处理所有状态和生命周期逻辑的整体类，而是可以拆分关注区域，并拥有较小的功能组件，这些组件仅关心与自身直接相关的事物。

---

编辑：hooks-intro文档中的以下代码片段可能会有所帮助：

钩子不能代替您对React概念的了解。相反，Hooks为您已经知道的React概念提供了更直接的API：道具，状态，上下文，引用和生命周期。正如我们将在后面显示的那样，Hooks还提供了一种新的强大方法来将它们组合在一起。

Answer 2

当前，在React中有两种构建组件的方法：

1. 类组件
2. 功能组件

You can check them here。构建它的方式是不同的。如果您使用类组件，则意味着您需要使用prototype of the object。

另一方面，如果您选择将其用作功能组件，则意味着您从React请求的所有内容都在调用功能，而根本不使用原型。所有来自JS的链接都可能降低性能，这就是为什么React核心团队决定转向纯粹的功能方向：它可以执行得更好，并且使其阅读起来更加简单（一旦您习惯了）。 / p>

关于第二个报价。这是一种显示函数编程优于类的更多好处的方法。它们更加灵活，可以组成更好的组合。

最后一个补充：接触功能组件并不意味着您可以忽略学习类组件。仍然有许多带有某些旧代码的应用程序。我建议您同时学习这两种方法，并在需要创建新组件时使用功能组件范例。