javascript - 在创建 React 组件时，我应该使用功能组件，React.createClass 还是 extends React.Component？

Question

我是 React 的新手，并且已经阅读了很多有关它的资料。我遇到了三种不同的方法来创建组件:

功能组件:

const Hello = ({world}) => {
  return (
    <div>{"Hello" + world}</div>
  );     
}

React.createClass(工厂):

const Hello = React.createClass({
  render: function() {
    return <div>{"Hello" + this.props.world}</div>
  }
});

ES6 类扩展

class Hello extends React.Component {
  render() {
    return (
      <div>{"Hello" + this.props.world}</div>
    );
  }
}

除了明显的功能组件没有任何状态耦合并且可能是一种更功能化的组件处理方法之外，我为什么要使用不同的方法？

在 React 文档中，他们使用了所有三种方法。一些 Stack Overflow文章建议使用 Class 方法，然后一些建议使用 Factory 方法。

Answer 1

对于无状态的组件，建议使用函数式。

如果您正在使用 ES6+/TypeScript 代码，建议使用 React.Component extend。 React Native 仅支持这种类型的组件创建。

React.createClass 用于 ES5。

浏览器即将全面支持Facebook推荐使用React.Component instead of React.createClass并使用 functional for stateless .

编辑

Facebook 添加了一个 deprecation warning to React.createClass in React 15.6.0并点用户使用create-react-class相反。