Question

我有一个状态为包含endDate和startDate的组件（可能还有其他东西，例如要显示的数据数组）。当日期范围更改时（使用日期选择器），我只写了：

onDateChangedHandler = (startDate, endDate) => {
  this.setState({ startDate, endDate });
}

后来，另一位（经验更丰富的）开发人员提交了请求请求，该请求除其他外，将代码更改为：

onDateChangedHandler = (startDate, endDate) => {
  const state = Object.assign({ ...this.state, startDate, endDate });
  this.setState({ ...state });
}

我要求他提供反馈，但无法得到任何答案。这里有很多我不理解的事情：

没有第二个参数的Object.assign是否毫无意义？
从documentation，Object.assign(target, ...sources)返回目标，并合并源。因此，如果没有传递任何源，它将仅返回target，使该语句无用。

为什么在将state变量传递给setState（）时重新传播它？
它应该已经是副本。

但是我的主要问题是：
将整个状态重新传递给setState而不是仅修改键是否有好处？
这样做时，与setState()异步相关的任何其他风险吗？

谢谢！

Answer 1

您的代码更好，而且您在每个方面都正确：

在Object.assign({ ...this.state, startDate, endDate })行中，assign仅返回传播所创建的对象。这个{ ...this.state, startDate, endDate }应该就够了。
正确。您无需再次克隆它。
这可能会导致问题，因为setState()是异步的，并且当前的this.state可能已过时。如果您需要使用setState()中的当前状态，请使用更新程序功能。例如：setState((prevState) => ({ counter: prevState.counter + 1, startDate, endDate })。但是，由于在更新状态时不需要包括prev状态，因此在这种情况下可以跳过它。

在setState（）中重新设置整个状态

1 个答案: