alibaba / butterfly

🦋Butterfly,A JavaScript/React/Vue2 Diagramming library which concentrate on flow layout field. (基于JavaScript/React/Vue2的流程图组件)
https://butterfly-dag.gitee.io/butterfly-dag/home
MIT License
4.43k stars 595 forks source link

无法获取拖拽生成的Edge对象 #883

Open Fnxxxxo opened 2 years ago

Fnxxxxo commented 2 years ago

The current behavior

用户无法通过system.link.connect回调获取连线ID。 连线成功回调system.link.connect返回了拖拽连线对象_dragEdges,该对象的ID在Vue环境下固定为bf_endpoint_${endpointId}-bf_endpoint_${endpointId}的格式,与实际连线的Edge对象没有关系。

The expected behavior

用户通过system.link.connect回调能拿到刚创建的连线,ID为实际ID,并能通过Canvas再次查到该连线。

Your environment(such as: Butterfly version、Browser version、OS and so on)

Butterfly version: 4.3.6

Browser version: chrome.v105

OS: win10

Steps To Reproduce, Maybe you can provide a simple demo.

1. 开启draggable与linkable配置,允许拖拽连线 2. 监听system.link.connect事件 3. 连线后对比事件回调给出的edge对象与canvas.edges实际连线对象
noonnightstorm commented 2 years ago

@Zt448143356

Zt448143356 commented 2 years ago

https://github.com/alibaba/butterfly/blob/master/docs/zh-CN/vue.md 这是vue的文档。你可以看一下。

项目里有vue的demo,你也可以运行一下。在下文的目录中 https://github.com/alibaba/butterfly/tree/master/vue

Fnxxxxo commented 2 years ago

https://github.com/alibaba/butterfly/blob/master/docs/zh-CN/vue.md 这是vue的文档。你可以看一下。

项目里有vue的demo,你也可以运行一下。在下文的目录中 https://github.com/alibaba/butterfly/tree/master/vue

好吧,这个回调对了。又是一个与dag不一致的地方。

Zt448143356 commented 2 years ago

https://github.com/alibaba/butterfly/blob/master/docs/zh-CN/vue.md 这是vue的文档。你可以看一下。 项目里有vue的demo,你也可以运行一下。在下文的目录中 https://github.com/alibaba/butterfly/tree/master/vue

好吧,这个回调对了。又是一个与dag不一致的地方。

是的。这是两个不同的库。两个的驱动方式不一样。理念也不一样。所以存在这样的问题。