如何确保 Draggable 组件不会超出可放置区域或 react-beautiful-dnd 中的某些特定 div？

如何解决如何确保 Draggable 组件不会超出可放置区域或 react-beautiful-dnd 中的某些特定 div？

如何确保 Draggable 组件不会超出可放置区域或 react-beautiful-dnd 中的某些特定 div？？

我想确保可拖动组件不会超出某些特定 div 或区域或可放置区域之外。

目前我找不到任何解决方法来限制 Draggable 组件在某些特定区域或容器中的移动。欢迎提供任何帮助和建议。

谢谢

解决方法

您可以为此使用 react-sortable-hoc。它允许您通过将 lockToContainerEdges 传递给 HOC 来锁定 sortableElement 以保留在 sortableContainer 中。 react-beautiful-dnd 也有一个很大的限制，它只能在一个方向上工作，即水平或垂直，但使用 react-sortable-hoc 您可以将 axis='xy' 传递给 sortableContainer HOC，它可以让您排序在网格中。