Question

我如何声明一个状态计数器，声明使用该计数器输出的其他变量，然后更新该计数器和onClick上的所有其他变量？是setState是async吗？我刚开始使用React。

const arr = Object.keys(questionAnswers).map(key => { return questionAnswers[key] });

this.current = 0;

this.state = {
    current: this.current,
    questions: arr[this.current].question,
    options: Object.keys(arr[this.current].options).map(key => { return arr[this.current].options[key]}),
    }
}

然后使用onClick函数进行更新：

nextQuestion = () => {
    this.current++
    this.setState({
    current: arr[this.current].question,
    options: arr[this.current].options
    });
}

Answer 1

您可以通过以下方式更新的计数器：

setState((prevState) => {current: prevState.current + 1});

Answer 2

您可以将状态称为this.state

Collection<UserAttempt> attempts = userIdToMaxAttempt.values();

this.state = {
  current: 0
  ...
}

每当状态更改时，react都会触发组件的重新渲染，因此可以始终引用this.state

Answer 3

setState 函数是分批执行的，并且是异步的。在您的情况下，如果要基于先前状态更新变量，则应在 setState 函数中使用函数。这将提供同步更新。

这样的事情。

this.setState((prevState, props) => ({
  current: prevState.current + 1
}));

在React中更新计数器的正确方法是什么

3 个答案: