class And Stateless

Do not use React.createElement unless initializing the app from a file that is not JSX!

If the component has internal state and/or refs, use class extends React.Component. If no state or refs is used, prefer normal functions (not arrow functions) over classes.

ESLint: react/prefer-es6-class and react/prefer-stateless-function

Examples

⇣ Incorrect code for this rule:

const Snow = React.createClass({
  render() {
    return <div>{this.state.snowflakes}</div>;
  }
});

No state or refs:

class Snow extends React.Component {
  render() {
    return <div>{this.props.snowflakes}</div>;
  }
}

// Relying on function name inference is discouraged.
const Snow = ({ snowflakes }) => (
  <div>{snowflakes}</div>
);

⇡ Correct code for this rule:

class Snow extends React.Component {
  render() {
    return <div>{this.state.snowflakes}</div>;
  }
}

No state or refs:

function Snow({ snowflakes }) {
  return <div>{snowflakes}</div>;
}