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

请问Vue版本如果通过API添加节点 #881

Open Fnxxxxo opened 2 years ago

Fnxxxxo commented 2 years ago

现有Vue示例通过给定初始data,可以画图。但如何通过canvas.addNode添加元素? 期望以这样的方式添加但失败了

canvas.addNode({
  id: nanoid(),
  left: 100,
  top: 100,
  render: BaseComponent
})
noonnightstorm commented 2 years ago

@Zt448143356 帮忙看看

Zt448143356 commented 2 years ago

你要添加数据,你直接改数据就可以了。这个是数据驱动的。你数据里加节点,图里会自动加上。 你可以看下vue的demo。 demo中有一些例子

Fnxxxxo commented 2 years ago

你要添加数据,你直接改数据就可以了。这个是数据驱动的。你数据里加节点,图里会自动加上。 你可以看下vue的demo。 demo中有一些例子

建议文档注明推荐方法。dag与vue使用方法不一致,做迁移体验很不好

Zt448143356 commented 2 years ago

你要添加数据,你直接改数据就可以了。这个是数据驱动的。你数据里加节点,图里会自动加上。 你可以看下vue的demo。 demo中有一些例子

建议文档注明推荐方法。dag与vue使用方法不一致,做迁移体验很不好

我们不建议做迁移,因为vue版本和dag版本存在一定的差异。 dag版本在性能、能力上远远强与vue版本。

如果在vue中会使用dag库去开发,那是最好的。也是最佳的解决方案。 vue版本开发出来是为了补全能力,也是提供给在vue框架下不会使用一些原生库的新手们比较简单的使用的。当然最终的目标是略弱于dag库的性能,并且具备dag的全部能力。

文档中确实没有说明这部分东西,我后面会对文档做下修改。把这部分建议加上。