상태 (상태) 반응

상태 기계 (주 기계) 등의 구성 요소에 반응한다. 사용자와의 상호 작용을 통해, 상기 UI를 렌더링 한 후, 해당하므로 사용자 인터페이스 및 데이터 일관성을 상이한 상태를 달성한다.

간단히 조립 상태를 업데이트하고, 반응 년 새로운 상태에 기초하여 사용자 인터페이스를 다시 렌더링 (DOM를 작동하지 않음).

다음의 예는 즉 초기 상태를 정의하는 데 사용LikeButton 구성 요소, getInitialState 방법, this.state 속성에서 읽을 수있는 개체를 만듭니다.사용자가 상태 변경을 초래 컴포넌트를 클릭 할 때마다 변경이 자동 this.render 다시 컴퍼넌트를 렌더링 호출 후 this.setState 방법은 상태 값을 수정한다.

var LikeButton = React.createClass({
  getInitialState: function() {
    return {liked: false};
  },
  handleClick: function(event) {
    this.setState({liked: !this.state.liked});
  },
  render: function() {
    var text = this.state.liked ? '喜欢' : '不喜欢';
    return (
      <p onClick={this.handleClick}>
        你<b>{text}</b>我。点我切换状态。
      </p>
    );
  }
});

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

»시도