react es5 与es6 区别总结

1. require 与 import -> es6 不再使用require，使用import

  // es5
  var React = require('react');

  // es6
  import React form 'react'

2. export 与 exports

  // es5
  modal.exports = Component;

  // es6
  export default Component;

3. component 和 function

// es5
  var MyComponent = React.createClass({
    return function() {
      return <>hello
    }
  })

  // es6
  class MyComponent extends React.Component {
    render() {
      return  <>hello;
    }
  }

4. props

es5: propsTypes
es6: this.props

5. state

// es5
var Counter = createReactClass({
  getInitialState: function() {
    return {count: this.props.initialCount};
  },
});

// es6
class Counter extends React.Component {
  constructor(props) {
    super(props);
    this.state = {count: props.initialCount};
  }
}