setValue(名称)和setValue(...name)在useState中有什么区别？

Question

更新作为数组的状态( setValue(name)或setValue(...name) )的正确方法是哪一种？扩展操作符(.)的用途是什么？通过我对这件事的洞察力。

Answer 1

让我们执行下一段代码，您将理解这一点:我们有：

const [names, setNames] = useState(null);

让我们想象一下，您确实添加了名称，现在执行以下操作：

setNames(['Andrii']);

你会看到你的状态被更新了，你的名字列表有一个值'Andrii‘。

如果您想要添加新的名称，那么您需要做下一步；

setNames([...names].concat('Vlad'));

如果你这样做：

names.push('Vlad');
setNames(names)

然后，您将看不到结果，因为只有当状态有新值时，setState才会更新您的页面。您没有新的值，因为对象有链接，它的工作方式如下：

oldState === newState？“无所事事”：“更新”

...names这是一个新的数组

Names.push(“某某物”)名!=新数组，因为它是具有新值的旧数组