React Flow

学习示例参考
GitHub 中文React Flow Pro
  • 示例
  • 功能概述
    • 自定义节点
    • 更新节点
    • 压力测试
    • 隐藏
    • 拖动句柄
    • 轻松连接
    • 在边缘放下时添加节点
    • 临近连接
    • 节点调整大小
    • 节点工具栏
    • 可旋转节点
    • 动态分组
    • 交叉点
    • 形状
    • 连接限制
    • 删除中间节点
    • 自定义边
    • 动画边
    • 边类型
    • 可编辑边
    • 重新连接边
    • 连接线
    • 多连接线
    • 边标记
    • 放下时删除边
    • 浮动边
    • 简单浮动边
    • 边标签渲染器
    • 临时边
    • 子流程
    • 水平流程
    • Dagre 树
    • Entitree Flex 树
    • Elkjs 树
    • Elkjs 多个句柄
    • 自动布局
    • 力导向布局
    • 展开和折叠
    • 工作流构建器
    • 交互属性
    • 拖放
    • 计算流程
    • 验证
    • 连接事件
    • 防止循环
    • 撤销和重做
    • 复制和粘贴
    • 辅助线
    • 触摸设备
    • 保存和恢复
    • 缩放过渡
    • 协作
    • 上下文缩放
    • 上下文菜单
    • 样式组件
    • Tailwind
    • Turbo Flow
    • 基本样式
    • 暗黑模式
    • 静态服务器端渲染
    • 下载图片
    • ReactFlowProvider
    • useReactFlow
示例布局
展开和折叠

展开和折叠

Pro

交互式示例,展示如何导航分层数据结构。您可以点击节点以切换其子节点并动画化布局更改。

这是一个 Pro 示例。 获取 所有 Pro 示例,来自 xyflow 团队的 1:1 支持,以及 React Flow Pro 订阅的优先级 Github 问题。

查看价格计划登录

关于此 Pro 示例

  • 订阅后,您将获得此示例的两个不同版本:一个使用 d3-hierarchy,另一个使用 dagre.js 作为布局引擎。
  • 动画可以轻松关闭,并使用 d3-timer 实现。
  • 依赖项:reactflow,d3-hierarchy,d3-timer
功能概述暗黑模式

xyflow 团队的项目

自 2019 年以来,我们一直在构建和维护基于节点的 UI 的开源软件。

文档

入门API 参考示例展示

社交

DiscordGithubX / TwitterBluesky

xyflow

博客开源关于联系
职业 招聘中

法律

MIT 许可证行为准则信息

info@xyflow.com — 版权所有 ©2024 webkid GmbH。保留所有权利 — 网站设计 by Facu Montanaro