Question

因此，我正在尝试学习ReactJs （我有AngularJs背景），而我在学习本教程时遇到了麻烦。

要创建项目，我们运行以下命令：

npx create-react-app app-name

然后，在本教程中，App.js是 class 。但是，当我运行该命令时，我的命令是函数。

教程App.js

class App extends Component {
render() {
return (
  <div className="App">
    <h1>Hello, world!</h1>
  </div>
);
}
}

我的App.js

function App() {
return (
<div className="App">

</div>
);
}

这部分我很困惑。

Answer 1

有相同的写法：函数组件和类组件。
在类组件支持React组件的整个生命周期的地方，功能组件实际上只是渲染函数。
您可以在此处了解差异：
https://reactjs.org/docs/components-and-props.html#function-and-class-components

在React的最新版本中，出现了一个称为Hooks的新功能，该功能使您可以执行功能组件中所需的一切： https://reactjs.org/docs/hooks-intro.html

希望这会有所帮助：）

Answer 2

反应组件可以是类，也可以是函数。两者都适用。使用类组件的优势在于，它为组件提供了更多的功能，例如状态，生命周期方法。这些组件通常很复杂。另一方面，功能组件非常简单，而且是基础知识。您还可以使用以下方法将功能组件转换为类组件： https://reactjs.org/docs/state-and-lifecycle.html

希望这会有所帮助！

React组件是函数而不是类

2 个答案: