React-ES6-ES7.md

#React ES7 ES6 ES5 Syntax

1. https://facebook.github.io/react/docs/reusable-components.html
2. https://facebook.github.io/react/blog/2015/01/27/react-v0.13.0-beta-1.html
3. https://babeljs.io/blog/2015/06/07/react-on-es6-plus
4. http://www.ian-thomas.net/autobinding-react-and-es6-classes/
5. http://blog.ricardofilipe.com/post/babel-react-es7-sample
6. standard/standard#372

ES7

ES7 require installation of stage-0: npm install --save-dev babel-preset-stage-0

Add transform:

  "browserify": {
    "transform": [
      [
        "babelify",
        {
          "presets": [
            "es2015",
            "stage-0",
            "react"
          ]
        }
      ]
    ]
  }

import React from 'react'
import ReactDOM from 'react-dom'
import $ from 'jquery'

class $1 extends React.Component {

  render() {
    var self = this;
    return (
      <div className="">
      </div>
    );
  }
  constructor(props) {
    super(props);
  }
  state = {count: props.initialCount};
  componentDidUpdate(prevProps, prevState){
    var self = this;
  }
  handleClick = (e) => {
    var self = this;
  };
}

module.exports = $1

ES6

import React from 'react'
import ReactDOM from 'react-dom'
import $ from 'jquery'

class $1 extends React.Component {

  render() {
    var self = this;
    return (
        <div className="">
        </div>
    );
  }
  constructor(props) {
    super(props);
    this.state = {count: props.initialCount};
    this.handleClick = this.handleClick.bind(this);
  }
  componentDidUpdate(prevProps, prevState){
    var self = this;
  }
  handleClick(e) {
    var self = this;
  }
}

module.exports = $1

ES5

var React = require('react');
var $ = require('jquery');

var $1 = React.createClass({

  render: function () {
    var self = this;
    return (
        <div className="">
        </div>
    );
  },
  getInitialState: function(){
    var self = this;
    return {
        v1: "v1"
    };
  },
  componentDidUpdate: function(prevProps, prevState){
    var self = this;
  }
});

module.exports = $1;