时间戳

首页 > 解决方案 > 将对象添加到状态时出现 React.js 错误（使用反应挂钩）

reactjs - 将对象添加到状态时出现 React.js 错误（使用反应挂钩）

问题描述

我有一个函数可以生成一个我想添加到我的状态的对象。我正在使用反应钩子。这是我的代码：

const [roomMatches, setRoomMatches] = useState({
                                         "user2":{ "percentMatch":"1.0"},
                                         "user3":{ "percentMatch": ".30"}
                                               })

var newMatch = {
                 survey:{
                            ['percentMatch']: .99
                        }
               }

setRoomMatches([...roomMatches, newMatch]);

我的问题是我不断收到同样的错误

Uncaught TypeError: roomMatches is not iterable

如何添加到当前状态而不删除该状态中的所有内容？

标签： reactjsreact-hooks

解决方案

看起来您正在尝试做的是将您的合并newMatch到现有roomMatches状态，然后更新状态。为此，您需要执行以下操作：

const newState = {...roomMatches, ...newMatch};
setRoomMatches(newState);

在上面的代码中，您尝试使用数组而不是对象来更新状态（并且，正如评论所暗示的，将对象传播到数组中是行不通的）。

推荐阅读