在React中集成jsPlumb

Question

需要在反应中实现jsPlumb并且我已经分析了反应集成的jsPlumb是许可的ReactjsPlumb。

我需要开源插件，作为jsPlumb在反应中工作，并尝试以下：

jsplumb-react，

react-dag。

我无法使用这些插件，因为这两个插件都是用TypeScript编写的。是否有任何其他插件可用，如jsPlumb与纯反应功能反应。

不知何故，添加jsPlumb社区版本反应如下：

class App extends Component {
     componentDidMount() {

       //later we use like that , is this recommended ?

       // $(".item").resizable({
       //     resize : function(event, ui) {            
       //             jsPlumb.repaint(ui.helper);
       //         },
       //         handles: "all"
       //     });

        jsPlumb.ready(function() {
               jsPlumb.connect({
                   source:"item_left",
                   target:"item_right",
                   endpoint:"Rectangle"
               });

               jsPlumb.draggable("item_left", {containment:"parent"});
               jsPlumb.draggable("item_right", {containment:"parent"});
           });
     }

     render() {
       return (
         <div id="diagramContainer">
           <div id="item_left"  className="item"></div>
           <div id="item_right" className="item" 
           style={{marginLeft:"150px"}}></div>
       </div>
       );
     }
   }

我不知道，使用jsPlumb（javascript + jQuery）with react将是一个更明智的选择，因为jsPlumb在内部处理拖放并直接处理DOM。 React是不同的。这感觉有点像僵局......有什么建议吗？

Answer 1

用React包装jQuery插件并不总是最好的选择。但是，很高兴知道它是一个选项以及如何实现解决方案。如果您将遗留的jQuery应用程序迁移到React，或者您根本找不到适合您需要的React插件，那么这是一个可行的选择。

检查this答案的详细解释