跳到正文
前端学习导航站
English (语言)

推荐一个站点

填个名字和网址,提交后会在 GitHub 打开推荐页,确认后即完成推荐。

React Flow

节点式画布的事实标准:拖拽连线做流程图、AI 编排界面,Stripe 都在用的底座

内容更新日期 · 2026-10-30

What is it · 它是什么

什么是 React Flow

React Flow(xyflow 团队出品)是构建节点式界面的 React 组件库:拖拽节点、连线成图、缩放平移开箱即用,高度可定制——工作流编辑器、思维导图、AI Agent 编排画布都用它当底座,Stripe、Typeform 等在生产使用。姊妹项目 Svelte Flow 同源。核心开源,Pro 版提供高级示例组件。

How to use · 怎么用

怎么用 React Flow

  1. 官网示例库按场景挑(流程图/DAG/白板)。
  2. 自定义节点用 React 组件写,数据驱动连线。
  3. AI 编排类界面直接参考官方 examples。

Key features · 核心特点

React Flow 的核心特点

  • 节点/连线/缩放/平移开箱即用
  • 自定义节点=普通 React 组件
  • Stripe 等生产验证,Svelte 版同源
  • 核心开源(Pro 高级组件付费)

同类推荐

内容型网站的首选框架:默认零 JS,需要交互的地方才插 React/Vue 岛屿

全球最流行的前端框架:v6 开始 CSS-first 主题化、组件翻新,连 AI 助手都有专属文档