React createClass规范对象格式

var MyComponent = React.createClass({
  displayName: 'MyComponent',
  
  propTypes: {
    // 组件属性的类型检查
    name: React.PropTypes.string.isRequired,
    age: React.PropTypes.number
  },
  
  getDefaultProps: function() {
    // 设置组件属性的默认值
    return {
      age: 18
    };
  },
  
  getInitialState: function() {
    // 设置组件的初始状态
    return {
      count: 0
    };
  },
  
  componentWillMount: function() {
    // 组件即将被挂载到页面前执行的操作
  },
  
  componentDidMount: function() {
    // 组件已经被挂载到页面后执行的操作
  },
  
  componentWillReceiveProps: function(nextProps) {
    // 组件接收到新的属性时执行的操作
  },
  
  shouldComponentUpdate: function(nextProps, nextState) {
    // 判断组件是否需要重新渲染
    return true;
  },
  
  componentWillUpdate: function(nextProps, nextState) {
    // 组件即将重新渲染前执行的操作
  },
  
  componentDidUpdate: function(prevProps, prevState) {
    // 组件重新渲染后执行的操作
  },
  
  componentWillUnmount: function() {
    // 组件将被卸载前执行的操作
  },
  
  handleClick: function() {
    // 处理组件的点击事件
  },
  
  render: function() {
    // 渲染组件的内容
    return (
      <div>
        <h1>Hello, {this.props.name}!</h1>
        <p>Age: {this.props.age}</p>
        <p>Count: {this.state.count}</p>
        <button onClick={this.handleClick}>Click me</button>
      </div>
    );
  }
});

ReactDOM.render(<MyComponent name="John" age={25} />, document.getElementById('root'));