为什么 React Interact JS 集成没有正确更新？

Question

我正在尝试集成 InteractJS 和 ReactJS，我发现将项目从一个拖放区移动到另一个拖放区时出现了一个奇怪但可预测的问题，并且 UI 和底层状态对象数组之间不匹配。我意识到这很可能是我的代码中的一个错误，因为我的知识有限或 React 更新和/或 InteractJS 事件 - 或两者兼而有之 - 但在盯着它三天后，我非常感谢任何洞察可能导致这个问题的原因。

我创建了一个最小的codesandbox to demonstrate the problem。

我可以将所有项目以相反的顺序拖动到放置区和放置区之间，并且状态和渲染输出都能正确更新。

但是，如果我将一个中间项目（即不是最后一个）从一个拖放区拖到另一个拖放区，React 会错误地在错误拖放区中的拖放项目之后立即重新渲染该对象。

我的问题是：为什么 React 渲染与中间项目的状态对象不匹配，但以相反的顺序拖动项目可以正常工作？

谢谢

Answer 1

在研究如何在 React.js 中处理多点触控手势（拖放、缩放、旋转等）时，我首先发现了 interactjs。它效果不佳，经过更多研究后，我发现enter link description here。良好的文档，它与动画库配合得很好。

我强烈建议不要在 React 项目中使用 interactjs。