将大量使用canvas的fabricjs应用程序移植到ReactJS

如何解决将大量使用canvas的fabricjs应用程序移植到ReactJS

如标题中所述，我正在尝试将主要依赖于fabricJS和画布操作的web应用的遗留代码移植到ReactJS。

我打算移植它的方式（在阅读了有关该主题的一些博客文章之后）是将旧应用程序放在一个大组件中，并为将来的功能构建新组件。我没有几个星期可以进行这种重构，因此决定在这个过程中，在将来我可能会花一些时间来继续将遗留代码模块化为组件。

该应用程序现在可以运行，但是fabric.js Canvas功能在没有引发任何错误的情况下以怪异的方式被破坏了。

在调试时，我注意到fabric.js mouSEOver-event目标不再按预期工作-当在画布上将多个Fabric对象相互叠加呈现时，在mouseEvent对象中找到的“目标”为总是背景中的那个。在过渡结构能够辨别背景和在其前面呈现的形状（圆形，正方形）之前。该功能的很大一部分依赖于能够识别单击了哪种Fabric对象。

我目前的理解是（我在这里可能错了），这些错误与react和fabric都尝试处理mouseEvents并且不喜欢彼此协同工作这一事实有关。

在How can I use Fabric.js with React?处找到的使用redux的修复程序是不可行的，因为产品负责人不想增加任何复杂性。

有人知道如何获得结构并做出反应以相互合作，甚至遇到相同的问题吗？