Javascript 如何同步调用此状态？

我知道react不会立即更新状态，那么有人能告诉我如何同步记录这个状态吗？因为我的状态不是布尔值，这个答案对我没有帮助。我也不明白为什么在点击prev按钮后，它会先增加值，然后再减少

    class A extends Component {
      constructor(props) {
        super(props);
        this.state = {
          value: 1
        }
      }


      handleNext() {
        this.setState(prevState => ({
          value: prevState.value + 1
        }));
        console.log(this.state.value);
      }

      handlePrev() {
        if(this.state.value > 1) {
          this.setState(prevState => ({
            value: prevState.value - 1
          }));
        }
        console.log(this.state.value);
      }

     render() {
       <Button bsStyle="primary" id="prev" onClick={() => this.handlePrev()}>Prev</Button>
       <Button bsStyle="primary" id="next" onClick={() => this.handleNext()}>Next</Button>
}

A类扩展组件{
建造师（道具）{
超级（道具）；
此.state={
价值：1
}
}
handleNext（）{
this.setState（prevState=>({
值：prevState.value+1
}));
console.log（this.state.value）；
}
handlePrev（）{
如果（this.state.value>1）{
this.setState（prevState=>({
值：prevState.value-1
}));
}
console.log（this.state.value）；
}
render（）{
this.handlePrev（）}>Prev
this.handleNext（）}>Next
}
设置状态的第二个参数是在状态更新后执行的回调

  handleNext() {
    this.setState({ value: this.state.value + 1 }, () => ({
      console.log(this.state.value);
    });
  }

发件人：

setState（）的第二个参数是一个可选的回调函数，它将在setState完成并重新呈现组件后执行。通常，我们建议对此类逻辑使用componentDidUpdate（）

setState
的第二个参数是在状态更新后执行的回调

  handleNext() {
    this.setState({ value: this.state.value + 1 }, () => ({
      console.log(this.state.value);
    });
  }

发件人：

setState（）的第二个参数是一个可选的回调函数，它将在setState完成并重新呈现组件后执行。通常，我们建议对此类逻辑使用componentDidUpdate（）

如果代码没有问题，请尝试在渲染函数中打印
this.state.value

例如：

class A extends Component {
  constructor(props) {
    super(props);
    this.state = {
      value: 1,
    };
  }

  handleNext() {
    this.setState(prevState => ({
      value: prevState.value + 1,
    }));
  }

  handlePrev() {
    if (this.state.value > 1) {
      this.setState(prevState => ({
        value: prevState.value - 1,
      }));
    }
  }

  render() {
    const { value } = this.state;
    return (
      <div>
        <h2>{ value }</h2>
        <button id="prev" onClick={() => this.handlePrev()}>Prev</button>
        <button id="next" onClick={() => this.handleNext()}>Next</button>
      </div>
    );
  }
}

如果代码没有问题，请尝试在渲染函数中打印
this.state.value

例如：

class A extends Component {
  constructor(props) {
    super(props);
    this.state = {
      value: 1,
    };
  }

  handleNext() {
    this.setState(prevState => ({
      value: prevState.value + 1,
    }));
  }

  handlePrev() {
    if (this.state.value > 1) {
      this.setState(prevState => ({
        value: prevState.value - 1,
      }));
    }
  }

  render() {
    const { value } = this.state;
    return (
      <div>
        <h2>{ value }</h2>
        <button id="prev" onClick={() => this.handlePrev()}>Prev</button>
        <button id="next" onClick={() => this.handleNext()}>Next</button>
      </div>
    );
  }
}

setState
将回调作为其第二个参数

handleNext() {
   this.setState(prevState => ({
          value: prevState.value + 1
        }),() => console.log('updated', this.state.value));

      }

setState
将回调作为其第二个参数

handleNext() {
   this.setState(prevState => ({
          value: prevState.value + 1
        }),() => console.log('updated', this.state.value));

      }

您的问题似乎在您链接到的问题中得到了直接回答。因此，您的示例“正常工作”，单击“上一步”不会先增加值，然后再减少值。-但是，您粘贴的确切代码也不直接起作用，因为它缺少一些大括号之类的东西。您的问题似乎在您链接到的问题中得到了直接回答。因此，您的示例“正常工作”，单击“上一步”不会先递增值，然后递减。-但是，您粘贴的确切代码也不能直接工作，因为它缺少一些花括号之类的东西。