将大量使用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的修复程序是不可行的,因为产品负责人不想增加任何复杂性。

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

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)