react15.x 升级到react16 React.createClass 问题

[jackieli123723]

react15.x 升级到react16 React.createClass not a function 剔除

<div id="container">

</div>  

/* 
react15.x.x组件
  var Letter = React.createClass({
    render: function() {
      return (
        <div>
          {this.props.children}
        </div>
      );
    }
  });

*/

/*react16.x.x*/
/*
react新版将废弃createClass，propType将会分到一个新的模块。
虽然会报warning，但是不影响插件和功能的使用.
建议用class 组件名首字母大写 extends React.Component{}这种形式来替换React.createClass。
*/
class Letter extends React.Component {
  render() {
     let letterStyle = {
      padding: 10,
      margin: 10,
      backgroundColor: this.props.bgcolor,
      /*backgroundColor: "#ffde00",*/ 
      color: "#333",
      display: "inline-block",
      fontFamily: "monospace",
      fontSize: "30px",
      textAlign: "center"
    };

   return (
        <div style={letterStyle}>
          {this.props.children}
        </div>
      );
  }
}

const destination = document.querySelector("#container");
/*
ReactDOM.render(
    <div>
      <Letter>A</Letter>
      <Letter>E</Letter>
      <Letter>I</Letter>
      <Letter>O</Letter>
      <Letter>U</Letter>
    </div>,
    destination
);
*/

ReactDOM.render(
    <div>
      <Letter bgcolor="#58B3FF">A</Letter>
      <Letter bgcolor="#FF605F">E</Letter>
      <Letter bgcolor="#FFD52E">I</Letter>
      <Letter bgcolor="#49DD8E">O</Letter>
      <Letter bgcolor="#AE99FF">U</Letter>
    </div>,
    destination
);