在 react-Native 中创建 UI 时，Class 和 Const 有什么区别？答案

【问题标题】：What is the difference between Class and Const when creating UI in react-Native?在 react-Native 中创建 UI 时，Class 和 Const 有什么区别？
【发布时间】：2019-05-03 08:09:56
【问题描述】：

const App = () => (
  <View>
    <Text>Test</Text>
  </View>
  )

class App extends Component {
  render() {
    return (
      <View>
        <Text>Test</Text>
      </View>
    );
  }
}

当我测试时，有两件事是相同的。请告诉我这两者的区别。

【问题讨论】：

React: when to use ES6 class based components vs. functional ES6 components?的可能重复

标签： reactjs react-native react-redux

【解决方案1】：

类组件是有状态的组件，而 const App 是无状态（或功能性）组件。

有状态组件用于：

初始化状态
修改状态
渲染一些东西

此外，它还有生命周期方法。

而无状态组件通常只用于返回一段 UI。

简而言之：类组件比功能组件更强大

编辑：

由于React Native 0.59，功能组件也可以具有状态。有关更多信息，请参阅Hooks-Intro。

【讨论】：

我认为在 hooks 之后这不再是真的了
@DoğancanArabacı 你是对的。我已经用钩子介绍的链接更新了我的答案。

【解决方案2】：

使用类你可以访问生命周期钩子，你可以在类中存储一个状态。使用类，您可以构建有状态组件或智能组件。这意味着您在类组件中处理逻辑，例如进行 http 请求

使用功能组件。在这种情况下是 const 您可以构建转储组件或无状态组件（组件仅用于显示数据）。这是保持你的反应代码可维护和可读的好方法。将其分解为更小的组件并将 props 传递给子组件。

你可以阅读更多here因为很长，所以我只是给你一个简要的概述

问候

【讨论】：

【解决方案3】：

类将用于容器组件。包含状态的“智能”功能组件。和数据并预览“哑”视图组件。

“哑”功能组件用于预览或更好地说。渲染通常从容器发送的东西。

现在使用钩子可以在函数组件中获取类组件的整个生命周期。唯一的区别是函数的状态更少！

【讨论】：