vue2 流程图

 

右键可以新增、编辑和删除节点、连线。点击保存可输出节点列表与连线列表，传给后台直接保存。

显示的时候，

 

用到组件：vue-super-flow

下载：npm install vue-super-flow

局部使用：

<template>
   <super-flow></super-flow>
</template>

<script >
import SuperFlow from 'vue-super-flow'
import 'vue-super-flow/lib/index.css'
export default {
   components: {SuperFlow}
}
</script>

gitHub地址：

https://github.com/keyzf/vue-super-flow

借鉴文章：

https://blog.csdn.net/qq_37899622/article/details/120187689

https://blog.csdn.net/cindy6666/article/details/124703192