react-flow实现dag工作流

news2024/11/26 3:50:08

1. 官方文档

Introduction to React Flow

2.效果

 

3. 代码

index.jsx

import { useState, useCallback, useEffect } from 'react';
import ReactFlow, {
	Controls,
	Background,
	applyNodeChanges,
	applyEdgeChanges,
	addEdge,
	ReactFlowProvider,
	useReactFlow
} from 'reactflow';
import 'reactflow/dist/style.css';
import { TaskNode } from './taskNode';
import { Button, Space, message } from 'antd';
import { saveMonthTaskInfo, getMonthTaskInfo } from '@/api/modules/month_task_dag';
import AddNode from './addNodeForm';
import { store } from "@/redux";

// const initialNodes = [
// 	{
// 		id: 'qb_value_cal',
// 		dat

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/750367.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

C++编程(二)—— 设计模式

文章目录 单例模式饿汉式单例模式懒汉式单例模式懒汉式单例模式2 工厂模式(创建型模式)简单工厂工厂方法抽象工厂总结 单例模式 一个类不管创建多少次多线,永远只能得到该类型一个对象的实例。 A* p1 new A(); A *p2 new A(); A *p3 new…

msvcr110.dll丢失的修复教程,找不到msvcr110.dll解决办法哪个更推荐

msvcr110.dll是微软的Visual C运行库文件之一。它是Microsoft Visual Studio 2012的一部分,用于支持运行在Windows操作系统上使用Visual C编写的应用程序。在Windows系统中非常重要,如果丢失或是损坏就会造成很多程序无法启动运行。 会出现以下的报错提…

将C++对象注册成QML控件并提供可被调用的函数

0x00 使用QML编写界面 import QtQuick 2.14 import QtQuick.Window 2.14 import QtQuick.Controls 1.4 import QtQuick.Controls 2.12 as Controls import QtQuick.Controls.Styles 1.4 import QtQuick.Controls.Material 2.12 //import com.HLD 1.0Window {visible: true;mini…

赛效:WPS文档怎么在文本中插入连续的编号

1:打开一个WPS文档,全选所有的段落。 2:点击“开始”选项卡里点击编号下拉菜单,选择一种编号样式并点击。 3:我们会看到每段前面已经自动出现编号,而且是连续的。这个时候,我们在文档末尾新增一…

基于串行和并行ADMM算法在分布式调度中的应用(Matlab代码实现)

💥💥💞💞欢迎来到本博客❤️❤️💥💥 🏆博主优势:🌞🌞🌞博客内容尽量做到思维缜密,逻辑清晰,为了方便读者。 ⛳️座右铭&a…

管理软件开发平台:用科技提升数据治理能力,实现流程化办公!

如果实现流程化办公,想必是很多企业心心念念的发展愿望。但是,如何实现?利用什么样的平台可以完成这一目标?这是很多人值得深思的问题之一。管理软件开发平台实行100%全源码开放,是轻量级、可视化低代码开发平台&#…

6.带你入门matlab 协方差和相关系数( matlab程序)

1.简述 协方差 Vcov(X) Vcov(X,flag(同上)); X为矩阵 相关系数 Rcorr(X) X为矩阵 协方差和相关系数函数的使用如下 代码及运行结果 %% 协方差 clear a…

kaggle学习笔记-餐厅数据挖掘

Zomato Complete EDA and LSTM model 背景 分析Zomato数据集的基本思想是为了公平地了解影响在班加罗尔不同地方建立不同类型餐厅的因素,每个餐厅的总评级,班加罗尔是这样一个城市,拥有超过12,000家餐厅,餐厅供应来自世界各地的…

Android 源码编译方法

和你一起终身学习,这里是程序员Android 经典好文推荐,通过阅读本文,您将收获以下知识点: 一、查看项目所在分支二、切换到目标分支三、查看当前所在分支四、编译Android源码五、source Android 编译环境六、lunch 所需的编译项目七、单编 模块…

2.10 Bootstrap 响应式实用工具

文章目录 Bootstrap 响应式实用工具打印类 Bootstrap 响应式实用工具 Bootstrap 提供了一些辅助类,以便更快地实现对移动设备友好的开发。这些可以通过媒体查询结合大型、小型和中型设备,实现内容对设备的显示和隐藏。 需要谨慎使用这些工具&#xff0c…

Qt实现右键菜单栏显示

用到头文件 qmenu.h qevent.h qlabel.h代码 #pragma once // QtTestMenu2.h #include <QtWidgets/QWidget> #include "ui_QtTestMenu2.h" #include "qmenu.h" #include "qevent.h" #include "qlabel.h"class QtTestMenu2 : publ…

基于Nonconvex规划的配电网重构研究(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…

【原理图专题】OrCAD Capture如何批量修改原理图网络名称

在实际的工作中,我们很少是从0到1。很多时候供应商或是前人已经给我们留下了电路图,我们要做的初级工作就是让这些标准电路为我们所用。 但事实却是,供应商他们自己公司有自己的一套画图命名标准,而我们自己也有一套命名规则。因为大为都是自己熟悉自己的,所以导致了不能…

【我们一起60天准备考研算法面试(大全)-第十天 10/60】

专注 效率 记忆 预习 笔记 复习 做题 欢迎观看我的博客&#xff0c;如有问题交流&#xff0c;欢迎评论区留言&#xff0c;一定尽快回复&#xff01;&#xff08;大家可以去看我的专栏&#xff0c;是所有文章的目录&#xff09;   文章字体风格&#xff1a; 红色文字表示&#…

PLL 设计理论

鉴相器的输出驱动电荷泵的开关&#xff0c;再经过滤波器得到一个输出电压&#xff0c;通过VCO产生一个频率&#xff0c;再通过分频器反馈回鉴相器。 杂散&#xff1a;常见的杂散分为参考杂散和小数杂散。参考杂散是指在锁相环输出信号的频谱中&#xff0c;特定频偏处出现的非理…

基于springboot的地铁轨道交通运营系统

博主主页&#xff1a;猫头鹰源码 博主简介&#xff1a;Java领域优质创作者、CSDN博客专家、公司架构师、全网粉丝5万、专注Java技术领域和毕业设计项目实战 主要内容&#xff1a;毕业设计(Javaweb项目|小程序等)、简历模板、学习资料、面试题库、技术咨询 文末联系获取 项目介绍…

【LeetCode】动态规划 刷题训练(九)

文章目录 环绕字符串中唯一的子字符串题目解析状态转移方程返回值完整代码 最长递增子序列子数组与子序列的区别状态转移方程完整代码 摆动序列题目解析状态转移方程f[i]状态转移方程g[i]状态转移方程 完整代码 环绕字符串中唯一的子字符串 点击查看:467. 环绕字符串中唯一的子…

Flutter——最详细(NavigationBar)使用教程

NavigationBar简介 Material 3 导航栏组件! 导航栏提供了一种持久且便捷的方式来在应用程序的主要目的地之间进行切换。 使用场景&#xff1a; 底部菜单栏模块 属性作用onDestinationSelected选择索引回调监听器selectedIndex目前选定目的地的索引destinations存放菜单按钮back…

Filter的四大插件(grok、date、mutate、mutiline)

Filter的四个插件 一、grok 正则捕获插件1、grok 的概念2、内置正则表达式调用3、常用的常量NetworkingpathsMonths: January, Feb, 3, 03, 12, DecemberDays: Monday, Tue, Thu, etc...Years?Syslog Dates: Month Day HH:MM:SSShortcutsLog formatsLog Levels 3、自定义表达式…

49. 字母异位词分组

题目链接&#xff1a;力扣 解题思路&#xff1a;字母异位词分组也就是将&#xff1a;字母以及字母个数都相同的单词组合成一组&#xff0c;然后返回结果&#xff0c;比如ate&#xff0c;eat&#xff0c;tea都是由1个a&#xff0c;1个t&#xff0c;1个e组成。 所以&#xff0c…