React setState的分支直接修改prevState？

Question

我正在查看一些示例反应代码（在antd文档中），我注意到它们的代码相当于：

this.setState(prevState => { prevState.name = "NewValue"; return prevState; });

这看起来有点顽皮，但它确实破坏了什么吗？由于它使用箭头功能，即使React在后台批量处理它也不会破坏正在应用的更改顺序。

当然，setState的目的是期望部分状态，因此可能存在性能副作用，因为它可能会尝试将整个状态应用于自身。

编辑:(回应@Sulthan）

实际代码如下：

handleChange(key, index, value) {
  const { data } = this.state;
  data[index][key].value = value;
  this.setState({ data });
}

n.b。 data是一个数组，所以它只是被引用复制然后变异。

它实际上是完全错误的，因为它甚至没有使用箭头功能来获得最新状态。

它来自可编辑的表格示例：https://ant.design/components/table/

Answer 1

你的例子也可以改写为：

this.setState(prevState => {
    prevState.name = "NewValue"
    return "NewValue";
});

当函数传递给state时，重要的是不要改变传递的参数并返回新状态。你的例子都失败了。

  

... prevState是对先前状态的引用。它不应该直接变异。相反，应该通过基于prevState ...

的输入构建新的状态对象来表示更改

（来自setState）

我不确定是否有可能在您的示例中使用setState，但查看更改日志我真的很怀疑。