React.Component与React.createClass

小编典典

React.Component与React.createClass

reactjs

我很困惑，组件和React类之间有什么区别？

以及何时在React类上使用组件？看起来组件是一个类，createClass创建一个组件。

https://facebook.github.io/react/docs/top-level-
api.html

React.Component

使用ES6类定义它们时，这是React组件的基类。有关如何在React中使用ES6类的信息，请参见可重用组件。有关基类实际提供的方法，请参阅Component
API。

React.createClass

给定规范创建一个组件类。组件实现了一个返回单个子对象的render方法。该孩子可能具有任意深的孩子结构。使组件与标准原型类不同的一件事是，您无需在它们上调用new。它们是为您构造后备实例（通过新实例）的便捷包装。

阅读 223

2020-07-22

共1个答案

小编典典

mixins React.createClass不支持的唯一功能MyComponent extends React.Component。

这样做getInitialState()你可以这样做：

class MyComponent extends React.Component {
  constructor(props, context) {
    super(props, context);

    // initial state
    this.state = {
      counter: 0
    };
  }

  ...
}

或者如果您使用像babel这样的转译器，则可以

class MyComponent extends React.Component {
  state = {
    counter: 0
  }

  ...
}

除了可以使用createClass提供的自动绑定之外，您可以.bind(this)像上面所示使用显式绑定，或使用粗箭头ES6语法：

class MyComponent extends React.Component {
  onClick = () => {
    // do something
  }
  ...
}

可以将其放入构造函数中，而不是将其放入componentWillMount中：

class MyComponent extends React.Component {
  constructor(props, context) {
    super(props, context);

    // what you would have put in componentWillMount
  }

  ...
}

在React文档本身中有更多细节，但是基本上React.createClass所购买的唯一附加功能是mixins，但是使用mixin可以完成的任何事情都可以通过上下文和更高顺序的组件来完成。

2020-07-22