Latest web development tutorials

Reagir Estado (estado)

Reagir à componente como uma máquina de estado (State Machines). Através da interação com o usuário, para atingir diferentes estados, em seguida, processar a interface do usuário, de modo que a interface do usuário e os dados de consistência.

Reagir anos, basta atualizar o conjunto de estado, e depois voltar a tornar a interface do usuário com base no novo estado (não operar DOM).

O exemplo a seguir cria componentesLikeButton, método getInitialState utilizados para definir o estado inicial, isto é, um objecto que pode ser lido por this.state propriedade.Quando o usuário clica no componente, resultando em uma mudança de estado, this.setState método para modificar o valor de status após cada modificação automaticamente chamar this.render torna o componente novamente.

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

tente »