Javascript 创建拖放卡时无法读取未定义的属性“map”

我使用图书馆：

我正试图达到这样的效果：

此处演示：

我将this.state.item['lists']移动到组件SortableList。在组件中，SortableList希望迭代items.listItems.map，但出现错误：

无法读取未定义的属性“map”

---

您需要首先遍历items数组，不要忘记返回结果：

    items.map(item => 
      item.listItems.map((value, index) => 
        <SortableItem key={`item-${value.id}`} index={index} value={value.id} />
      )
    )

你应该改变

逐项

---

items.listItems是未定义的-考虑到items是一个数组，它不太可能有一个名为listItemsAs@JaromandaX的属性，它是未定义的。尝试使用断点或console.log命令找出错误所在。@JaromandaX我在SortableList中使用了console.logitems。我有一个包含三个对象的数组。每个物体都有属性listItems@Andréreichlet我在SortableList中创建了console.logitems。我有一个包含三个对象的数组。每个对象都有属性列表项。。。这是一个数组。。。和数组没有名为listItems的属性。。你已经证明了我的评论是正确的

    items.map(item => 
      item.listItems.map((value, index) => 
        <SortableItem key={`item-${value.id}`} index={index} value={value.id} />
      )
    )

{item.listItems.map((value, index) => (
        <SortableItem key={`item-${value.id}`} index={index} value={value.id} />
 ))}