对于React来讲，一切都已组件形式拼接，有组件就免不了要进行用户交互，用户交互就会有交互状态，react中设定了一个state进行状态管理。

大家可以参考如下代码：

@H_301_5@var LikeButton = React.createClass({
  getInitialState: @H_301_5@function() {
    @H_301_5@return {liked: false};
  },handleClick: @H_301_5@function(event) {
    @H_301_5@this.setState({liked: !@H_301_5@this.state.liked});
  },render: @H_301_5@function() {
    @H_301_5@var text = @H_301_5@this.state.liked ? 'like' : 'haven\'t liked';
    @H_301_5@return (
      <p onClick={@H_301_5@this.handleClick}>
        You {text} @H_301_5@this. Click to toggle.
      </p>
    );
  }
});

ReactDOM.render(
  <LikeButton />,document.getElementById('example')
);

上面代码是一个 LikeButton 组件，它的 getInitialState 方法用于定义初始状态，也就是一个对象，这个对象可以通过 this.state 属性读取。当用户点击组件，导致状态变化。

this.setState 方法就修改状态值，每次修改以后，自动调用 this.render 方法，再次渲染组件。

由于 this.props 和 this.state 都用于描述组件的特性，可能会产生混淆。一个简单的区分方法是，this.props 表示那些一旦定义，就不再改变的特性，而 this.state 是会随着用户互动而产生变化的特性。