流程图拖拽效果

/*
e: 鼠标事件
   部分代码
*/ 

import { Addon } from '@antv/x6'

initShape=(e)=> {
    // 拖拽添加节点
    const dnd = new Addon.Dnd({
      target: this.graph, //目标画布（必传）
      animation: true 
    })
    const node= this.graph.createNode({
      width: 100,
      height: 100,
      shape: 'rect',
      attrs: {
        body: {
          fill: '#ccc'
        }
      }
    })
    dnd.start(node, e)
}

// 使用
<Button onMouseDown={e => initShape(e)}> node </Button>

其他配置可见：拖拽 Dnd | X6