Skip to Content

内置组件

¥Built-In Components

React Flow 附带几个内置组件,可以作为子组件传递给 <ReactFlow /> 组件。

¥React Flow comes with several built-in components that can be passed as children to the <ReactFlow /> component.

MiniMap

MiniMap 提供流程图的鸟瞰视图,使导航更容易,尤其是对于较大的流。你可以通过提供 nodeColor 函数来自定义小地图中节点的外观。

¥The MiniMap provides a bird’s-eye view of your flowgraph, making navigation easier, especially for larger flows. You can customize the appearance of nodes in the minimap by providing a nodeColor function.

控件

¥Controls

React Flow 附带一组用于视口的可自定义 Controls。你可以放大和缩小、适应视口,并切换用户是否可以移动、选择和编辑节点。

¥React Flow comes with a set of customizable Controls for the viewport. You can zoom in and out, fit the viewport and toggle if the user can move, select and edit the nodes.

背景

¥Background

Background 组件为你的流程图添加了可视化网格图案,帮助用户保持方向。你可以从不同的模式变体中进行选择,或者如果你需要更高级的自定义功能,你可以探索 source  代码来实现你自己的模式。

¥The Background component adds a visual grid pattern to your flowgraph, helping users maintain orientation. You can choose from different pattern variants, or if you need more advanced customization, you can explore the source  code to implement your own pattern.

面板

¥Panel

Panel 组件允许你向流程图添加固定叠加层,非常适合标题、控件或任何其他应保持静止的 UI 元素。

¥The Panel component allows you to add fixed overlays to your flowgraph, perfect for titles, controls, or any other UI elements that should remain stationary.

高级

¥Advanced

对于更高级的用例和自定义,我们在 API 组件概览 中提供了更多内置组件,你可以查看。

¥For more advanced use cases and customization, we have even more built-in components you can check out in the API components overview

Last updated on