与渲染相比，反应钩子

Question

我非常新鲜，可以做出反应，并在开始一个新项目时发现Boilderplate与最近有所不同。现在它带有这样的东西：

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;

渲染功能消失了。我发现这与钩子有关。

现在的班级在React中是否去了？渲染功能是如此吗？我知道您仍然可以使用"旧方法"，但只是为了确保我做对了。它与钩子有关吗？

挂钩比较渲染和班级编写组件的方式是什么？

我想这也适用于反应 -

Answer 1

这不是一种旧的方式或新方法。这只是两种不同的方式，已经存在一段时间了。

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

如果您构建了具有自己的状态的更复杂的组件，则可以将它们实现为类，则可以使用类组件。这是您在帖子中的第二个符号：具有渲染函数的类，进而返回JSX表达式。

两者都很好地描述了React文档。

Answer 2

来自React Docs：

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

钩子是React 16.8中的新增加。他们让您使用状态和其他React功能而无需编写课程。

渲染功能尚未消失。您的功能组件仍然是"渲染函数"，因为它们会返回应该渲染到屏幕的内容。

之前，要使用state并具有其他功能，例如组件生命周期，您需要将组件写入课程。使用钩子，这是不再需要的，我认为您将访问具有更清晰的API和语法的state和其他功能。您的代码将变得更加可读。

来自Hooks FAQ：

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

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

否。没有计划从React中删除课程 - 我们所有人都需要保留运输产品并且无法负担重写。我们建议在新代码中尝试挂钩。

我应该使用钩子，类或两者的混合吗？

准备就绪后，我们鼓励您开始在编写的新组件中尝试挂钩。确保团队中的每个人都使用它们并熟悉此文档。除非您打算重写它们(例如修复错误(，否则我们不建议将现有类重写为钩子。

。

您不能在类组件内使用钩子，但是您绝对可以将类和功能组件与单个树中的钩子混合在一起。组件是使用钩子的类还是使用钩子的函数是该组件的实现细节。从长远来看，我们期望挂钩是人们写反应组件的主要方式。

挂钩覆盖所有类用例？

我们的目标是使钩子尽快覆盖所有上课的用例。尚无罕见的getSnapshotBeforeUpdate和componentDidCatch生命周期的钩子，但我们计划尽快添加它们。

这是挂钩的早期，一些第三方库可能与钩子既不兼容。