在网格上拖放对象列表

Question

我正在构建一个 web 应用程序（在 django 上），我要求用户提供以下内容：

行数：x

列数：y

以交互方式让用户决定行列标签

以及要拉入虚拟网格的对象列表

让我们以 3 列、4 行标签列 i (i=1..x)、行 j (j=1..y) 和 3 个名为“red”“black”“grey”的对象为例

有了这些，我想在自动构建的网格上进行拖放对象交互。

当从对象池中拉出块时，它们可以放置在网格的盒子中而无需将它们从池中移除（对象是无限的）。所以基本上用户可以用红色填充所有东西，三种颜色的混合，一些填充和一些空，等等..

可以在此处找到屏幕截图示例： https://imgur.com/a/BJMzr9q

您知道是否已经为此目的创建了一些东西吗？我查看了“可拖动”库，但没有一个示例真正适合我的情况。

希望你能帮忙。

如果不清楚，我还在学习阶段。

Answer 1

你可以使用 HTML5DnD https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API 它具有用于配置要拖动的项目和要放置的项目的 API。