javascript - 拖放以交换输入字段

Question

我目前正在尝试将桌面应用程序重写为可以在浏览器中运行的应用程序。我(或多或少)知道如何重写大部分功能，但有一个特别的功能我不确定如何解决。

所以该应用程序确实有文本字段(数百个)。您可以单击其中任何一个并输入一些数据。到目前为止一切都很好，但接下来的事情是，您可以拖放以相互交换它们(或它们的内容)。

在桌面上，拖放是用鼠标右键完成的，但我不确定这对于网络是否可行。我也在查找一些拖放库，但它们似乎都处理更多“静态”元素，如 div、图像等，但从不输入字段(也许是因为它们正在窃取点击事件？)。

这里有人有一个聪明的想法如何实现这样的事情吗？也许其他人已经做过类似的事情，或者如果 XYZ 可能会更容易做？理想情况下在 React 中(因为这就是我在应用程序的其余部分中使用的)，但如果它以任何其他方式工作，也许我将能够采用它。

感谢您提前提出的任何建议。

Answer 1

我使用https://github.com/atlassian/react-beautiful-dnd 主要思想是使用 Draggable 和 Droppable 组件。此外，还可以处理单击和拖动事件。但有点复杂。