Latest web development tutorials

Reaccionar Estado (Estado)

Reaccionar al componente como una máquina de estados (Máquinas de Estado). A través de la interacción con el usuario, para lograr diferentes estados, a continuación, hacer que la interfaz de usuario, de modo que la interfaz de usuario y los datos de consistencia.

Reaccionar años, sólo tiene que actualizar la asamblea estatal, y luego volver a hacer la interfaz de usuario basado en el nuevo estado (no operar DOM).

El siguiente ejemplo crea componentesLikeButton, getInitialState método utilizado para definir el estado inicial, es decir, un objeto que puede ser leído por this.state propiedad.Cuando el usuario hace clic en el componente, lo que resulta en un cambio de estado, this.setState método para modificar el valor de estado después de cada modificación llamada automáticamente this.render dibuja el componente nuevo.

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')
);

Trate »