React新手求助：为何代码报‘is not iterable’错误？

错误根源 #

报错is not iterable是因为这行代码：

const newVars = [newVar, ...myMarkedDates];

• myMarkedDates的初始值是对象（从myVar的结构能看出来），而数组里的扩展运算符...要求操作对象必须是可迭代类型（比如数组、字符串），普通JS对象默认不具备可迭代性，所以触发了这个错误。
• 另外你初始状态是对象类型，但这里强行转成数组，后续如果组件依赖对象结构来渲染（比如日历组件的markedDates一般都是对象格式），还会引发更多问题。

正确写法 #

如果你的需求是合并日期标记对象，应该用对象扩展运算符来合并两个对象，保持状态结构一致：

const newMarkedDates = { ...myMarkedDates, ...newVar };
setMarkedDates(newMarkedDates);

这样会把myMarkedDates和newVar的所有键值对合并成新对象，既不会触发迭代错误，也符合初始状态的结构要求。

内容的提问来源于stack exchange，提问作者justdan0227