jsplumb+dragable+vue(三)

nana發表於2018-09-04
JSVue

總結 用到的jsplumb方法

jsPlumb.connect({ source: PageSourceId, target: PageTargetId }, con);連線兩個節點
jsPlumb.getAllConnections();獲取連線線資訊
jsPlumb.detachEveryConnection();刪除所有的連線
jsPlumb.removeAllEndpoints(id);刪除節點的所有端點
jsPlumb.detach(contentid);刪除連線線
jsPlumb.addEndpoint(id， { anchors: “BottomCenter” }, that.circlecss)新增端點
jsPlumb.draggable(id);允許節點拖拽

以上

注意因為vue是單頁面可能重繪時候之前的資訊還有所保留所以最好初始化時候獲取連線線，如果大於0則先刪除所有連線線再重繪圖

  if(jsPlumb.getAllConnections().hasOwnProperty(`jsPlumb_DefaultScope`)) {
     
       if( jsPlumb.getAllConnections().jsPlumb_DefaultScope.length >0) {
         
         jsPlumb.detachEveryConnection()
     
         };
    }

完結 撒花！！！

相關文章