React 中的状态设置 this.setState()

React 中的状态设置，即 setState。这是一个核心概念，但它在 类组件和 函数组件（使用 Hook） 中有不同的写法和行为。

我会分两部分来解释。

---

第一部分：类组件中的 setState

在类组件中，状态是一个叫 this.state 的对象，而更新状态的方法是 this.setState()。

1. 基本用法

setState 用于更新组件的状态对象，并通知 React 需要重新渲染。

class Counter extends React.Component {
   
   
  constructor(props) {
   
   
    super(props);
    this.state = {
   
   
      count: 0
    };
  }

  increment() {
   
   
    // 传入一个新的对象来更新状态
    this.setState({
   
    count: this.state.count + 1 });
  }

  render() {
   
   
    return (
      <div>
        <p>You clicked {
   
   this.state.count} times</p>
        <button onClick={
   
   () => this.increment()}