为什么将此计为变异状态?

0 javascript jsx reactjs

handleClick(event) {
let value = event.target.value;

this.setState({ question: (this.state.question += value) });
Run Code Online (Sandbox Code Playgroud)

我收到警告:

不要直接改变状态。使用setState()react / no-direct-mutation-state

如果我尝试用此代码加载页面。
我该如何解决,以免出现警告?
它说要使用this.setState,但这就是我正在做的。

ic3*_*3rg 5

你做不必要的任务除了this.state.question-你只需要另外这里。此外,当根据先前的值更新状态时,文档状态为

React可以将多个setState()调用批处理到单个更新中以提高性能。由于this.props和this.state可以异步更新,因此您不应依赖于它们的值来计算下一个状态。

根据先前的值更新状态的正确方法是传入更新函数,该更新函数以先前的值为准,即:

this.setState(prevState => ({ question: prevState.question + value }));
Run Code Online (Sandbox Code Playgroud)