内置组件
🌐 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 组件为你的流程图添加了可视化网格图案,帮助用户保持方向感。你可以从不同的图案变体中进行选择,或者如果需要更高级的自定义,你可以查看 源代码 来实现你自己的图案。
🌐 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