React拖放-react-dnd-同时使组件可拖放（同时应用两个角色-拖放）

Question

我创建了我的应用程序的简化版本。

它在这里：https://codesandbox.io/s/quirky-glade-x4h51

当前版本具有书签（顶部行）和它们的位置。 使用时，将书签从书签行拖放到适当位置，一切正常。 但是，如果用户将其中一个拖到其他地方并想将其移动到某个地方怎么办？

我将PlaceForChart组件都包装到DropTarget（）和DragSource（）并导出了包装的组件。但是它不能正常工作。 如果移除任何包装材料，它将起作用。

当前，当用户尝试拖动任何PlaceForChart组件（橙色）时，该组件会更改颜色（按预期），但不会移动。

如何使其工作？

Answer 1

我在PlaceForChart.tsx中更改了key = {Math.random（）}，它开始起作用。还有其他一些问题，但它们与dnd行为无关。这是主要的。

工作版本：https://codesandbox.io/s/billowing-wave-tjugx