ReactJS：在组件类中不需要构造函数的一些标准是什么？答案

【问题标题】：ReactJS: What are some criteria for not needing a constructor in a component class?ReactJS：在组件类中不需要构造函数的一些标准是什么？
【发布时间】：2018-03-02 23:45:37
【问题描述】：

我想知道在组件的类声明中不需要构造函数的条件。我认为这是用于无状态组件，但还有其他原因吗？例如，组件内部没有任何功能（除了生命周期功能）是一个吗？

【问题讨论】：

你在问这个之前搜索过吗？ stackoverflow.com/questions/38712524/…
When to use constructors in React components?的可能重复
它部分回答了我的问题。我想知道除了缺乏内部状态之外是否还有其他原因。例如，如果您的组件是无状态的，但也声明了一些函数（不是生命周期函数），您是否需要构造函数？
问题应该是当你确实需要一个构造函数。除非您必须设置状态或绑定某些方法（s.t. 您不会在渲染时绑定它们）或您可能需要的任何其他东西，否则您不必编写它。如果它只是在那里什么都不做，它对任何事情都没有帮助。 @connected_user：回答上述评论：否

标签： javascript reactjs constructor stateless component-design

【解决方案1】：

我认为这里只摘录react docs 的摘录（强调我的）是合适的：

构造函数是初始化状态的正确位置。 如果你不这样做 初始化状态并且你不绑定方法，你不需要 为你的 React 组件实现一个构造函数。

【讨论】：

【解决方案2】：

如果组件在使用前需要设置内部状态，我通常只添加构造函数，否则我会省略构造函数。在组件中有功能不会影响我在这方面的决定

【讨论】：

【解决方案3】：

如果您使用 babel stage-2 预设，您实际上根本不需要构造函数，因为它提供了有效替换其用法的类属性：

class Component extends React.Component {
  constructor() {
    this.state = {};
    this.handleClick = this.handleClick.bind(this);
  }

  handleClick() { console.log('click'); }
}

变成

class Component extends React.Component {
  state = {};
  handleClick = () => console.log('click');
}

忽略这一点，仅当您需要将组件方法绑定到其上下文或需要初始化state 属性时才需要构造函数。

另一种情况是，如果您需要对 this.props 类属性做一些事情，但 React 认为这是一种反模式。

class Component extends React.Component {
  constructor() {
    this.state = {
      // don't do this! anti-pattern! duplication of source of truth!
      duplicatedState: this.props.myName,
    };
  }
}

【讨论】：