Question

我是一个非常新的反应者，发现当您开始一个新项目时，样板与最近有些不同。现在它带有这样的东西：

import React from 'react';

function App() {
  return (
    <div>
      <h1>Hello world!</h1>
    </div>
  );
}

export default App;

以前是这样的：

import React, { Component } from 'react';

class App extends Component {
  render() {
    return (
      <div>
        <h1>Hello World</h1>
      </div>
    )
  }
}

export default App;

渲染功能不见了。我发现这与钩子有关。

现在上课的同学有反应吗？渲染功能呢？我知道您仍然可以使用“旧方法”，但只是要确保我做对了。与钩子有关吗？

与使用钩子编写组件的渲染方式和类方式相比，钩子有什么好处？

我想这也适用于本机反应...

Answer 1

这不是旧方法也不是新方法。只是存在两种不同的方式而已。

如果您构建没有状态的简单组件，则可以使用功能组件。这是您帖子中的第一个符号：一个返回JSX表达式的函数。

如果您构建带有状态的更复杂的组件（可以将它们实现为类），则可以使用 Class Components 。这是您帖子中的第二种表示法：具有render函数的类，该类又返回JSX表达式。

两者在React docs中都有详细描述。

Answer 2

从React DOCS：

https://reactjs.org/docs/hooks-intro.html

挂钩是React 16.8中的新增功能。他们让您无需编写类即可使用状态和其他React功能。

渲染功能没有消失。您的功能组件仍然是“渲染功能”，因为它们会将应渲染的内容返回到屏幕。

在使用state并使用其他功能（如组件生命周期）之前，您需要将组件编写为类。我认为，有了钩子，就不再需要它了，您将可以使用更清晰的API和语法访问state和其他功能。您的代码将更具可读性。

来自Hooks常见问题解答：

https://reactjs.org/docs/hooks-faq.html

我需要重写我所有的课堂组件吗？

不。目前尚无计划从React中删除类-我们所有人都需要继续交付产品并且无法承担重写费用。我们建议在新代码中尝试使用Hooks。

我应该使用挂钩，类还是两者的混合？

准备就绪后，建议您开始尝试在编写的新组件中使用Hooks。确保团队中的每个人都在使用它们并熟悉本文档。我们不建议您将现有的类重写为Hooks，除非您计划以任何方式重写它们（例如，修复错误）。

您不能在类组件内部使用Hook，但是您可以将类和函数组件与Hooks混合在一棵树中。组件是使用Hooks的类还是函数都是该组件的实现细节。从长远来看，我们希望Hooks成为人们编写React组件的主要方式。

挂钩涵盖了类的所有用例吗？

我们的目标是让Hooks尽快涵盖类的所有用例。目前还没有与不常见的getSnapshotBeforeUpdate和componentDidCatch生命周期相对应的Hook等效项，但我们计划尽快添加它们。

对于Hooks来说还为时过早，某些第三方库目前可能与Hooks不兼容。

与渲染相比，React钩子

2 个答案: