reactjs – React中的状态是什么？

发布时间：2020-12-15 20:16:54 所属栏目：百科来源：网络整理

导读：我知道状态允许我们创建动态和交互的组件,但我想深入了解状态. 有人可以帮助我使用现实生活中的例子了解React中的状态吗？解决方法 import React from 'react';class App extends React.Component { state = { count: 0 }; render() { return ( div h1Hello

我知道状态允许我们创建动态和交互的组件,但我想深入了解状态.

有人可以帮助我使用现实生活中的例子了解React中的状态吗？

解决方法

import React from 'react';

class App extends React.Component {
  state = {
    count: 0
  };

  render() {
    return (
      <div>
        <h1>Hello world</h1>
        <h2>Count: {this.state.count}</h2>
        <button
          onClick={() => this.setState(state => ({ count: state.count + 1 }))}
        >
          +
        </button>
        <button
          onClick={() => this.setState(state => ({ count: state.count - 1 }))}
        >
          -
        </button>
      </div>
    );
  }
}

export default App;

在上面的代码中,它有一个state属性/ state：count.

状态可以简单地理解为特定组件/应用程序的那个时间点的值.在上面的示例中,当应用程序首次运行时,应用程序的状态计数为=== 0

我们可以看到有两个按钮 – 使用this.setState更新值,它只是更新应用程序的计数“状态”,每当状态发生变化时应用程序将重新呈现

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!