javascript - 在React中使用for循环对象时出现有线错误

当我尝试遍历对象并返回子组件时，我只是遇到了一个奇怪的错误。

这是我要执行的代码：

 if(itemData){
      var listItem;
      for (var key in itemData) {
       let data = itemData[key]

        listItem = [...listItem, (<ListItem itemData= {data} />)];
       }
     console.log(listItem, 'list item');
    }

它说：

TypeError: Invalid attempt to spread non-iterable instance
 for (var key in itemData) {
  31 |    let data = itemData[key]
  32 |
> 33 |     listItem = [...listItem, (<ListItem itemData= {data} />)];
     | ^  34 |    }
  35 |  console.log(listItem, 'list item');
  36 | }

PS：itemData只是一个普通的对象，里面有一些字段。
有人可以看一下我的代码并告诉我哪里出了问题吗？
遍历数组和对象之间有什么区别吗？

最佳答案

您仅声明了var listItem;，并且没有为其分配任何内容，因此其第一次迭代的值为undefined。

要解决此问题，请将您的声明更改为：

var listItem = [];

关于javascript - 在React中使用for循环对象时出现有线错误，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/53903127/