函数是否应该始终用于传递数组或对象的 setState？

Question

为了提高我对函数式组件中 React 的理解，我看到一些在传播数组或对象时通过函数传递 seState 的函数。当我引用 docs 时，我看到：

Unlike the setState method found in class components, useState does not automatically merge update objects. You can replicate this behavior by combining the function updater form with object spread syntax

所以我想了解为什么要执行此操作：

const [count, setCount] = useState([initialCount]);

setCount([...count, newCount])

在涉及数组和对象时不是首选，并且：

const [count, setCount] = useState([initialCount]);

setCount(prevCount => [...prevCount, newCount])

是首选。在我的答案研究中，我还没有找到关于这个的答案，我已经通读了：

What is the equivalent of passing an updater to setState that takes (state, props) as an argument to update state, using React Hook?
setState with spread operator

我可以确定该功能需要的唯一结论是：

可能是由于对象或数组在内存中的存储方式
传递的数据大小

为什么在 useState 中涉及数组和对象时，应该使用与常用函数相反的函数传递？

Answer 1

最好的做法可能是将一个函数传递给 useState 分派，以避免渲染不同步，尤其是当您使用异步方法更新状态时，而且在您的新状态依赖于先前状态的任何时候状态（甚至递增数字，而不仅仅是对象和数组）。

As Kent C. Dodds illustrates，当新状态更新依赖于先前状态时，在闭包以及渲染和函数调用的时间方面存在问题。

如果您想将数据与以前的状态合并，您希望确保与最新状态合并（从那个特定的合并调用开始）。 setState dispatch 提供前一个状态作为第一个参数。您可以确定这是最新状态（对于该合并），并且您不会得到不同步的数据或乱序更新。

函数是否应该始终用于传递数组或对象的 setState？

Should a function always be used for a setState that gets passed an array or object?

reactjs

react-functional-component

use-state