index

例子

// 数据结构
const data = [
  {
    id: "item 1",
    label: "item 1",
    children: [
      {
        id: "item 1 - 01",
        label: "item 1 - 01",
      },
      {
        id: "item 1 - 02",
        label: "item 1 - 02",
        children: [
          {
            id: "item 1 - 02 -01",
            label: "item 1 - 02 -01",
            children: [
              {
                id: "item 1 - 02 -01 -01",
                label: "item 1 - 02 -01 - 01",
                children: [],
              },
              {
                id: "item 1 - 02 -01 -02",
                label: "item 1 - 02 -01 - 02",
                children: [],
              },
            ],
          },
        ],
      },
      { id: "item 1 - 03", label: "item 1 - 03", children: [] },
    ],
  },
  {
    id: "item 2",
    label: "item 2",
    children: [{ id: "item 2 - 01", label: "item 2 - 01", children: [] }],
  },
];

报错

react-beautiful-dndUnable to find draggable with id: item-0

1. 删除 <React.StrictMode> ，并不是解决办法。
2. 让 React 18 的“严格模式”与 react-beautiful-dnd 配合使用
3. 一个非常简单的解决方案