即使添加了 useEffect，React useState 也不会更新答案

【问题标题】：React useState doesn't update even with useEffect added即使添加了 useEffect，React useState 也不会更新
【发布时间】：2022-07-19 21:59:17
【问题描述】：

这可能是 useState 没有更新的经典问题。

所以有一个带有一些复选框的树，其中一些在映射来自端点的一些数据时已经被选中。

用户可以选中/取消选中它们。有一个“取消”按钮可以将它们重置为原始表单。

代码如下：

  const [originalValues, setOriginalValues] = useState<string[]>([]);

  ...

  const handleCancel = () => {
    const originalValues = myData || []; //myData is the original data stored in a const
    setOriginalValues(() => [...myData]);
  };

  ...

  useEffect(() => {
    setOriginalValues(originalValues);
  }, [originalValues]);

但是，它不起作用，树没有按应有的方式更新。这里有什么问题吗？

【问题讨论】：

我看到的第一个问题是您遇到了useEffect(() => { setOriginalValues(originalValues); }, [originalValues]); 的某种无限循环。从依赖数组中删除 originalValues 以退出循环。请提供一个 condesandbox 来展示您的问题。
什么不起作用？选中/取消选中单个复选框？或重置
此外，处理程序可能没有按照您的意图进行。你认为那里发生了什么？

标签： javascript reactjs typescript react-hooks use-state

【解决方案1】：

只需执行以下操作

setOriginalValues([...myData]);

【讨论】：