您可以使用https://github.com/projectstorm/react-diagrams，这是其演示的链接。

实现的视图看起来与您在给出的图片中提到的非常相似。另外因为它说它是可定制的，你可以根据你的要求让它看起来像

Syncfusion 支持在 React 中创建带有自定义形状、标签和端口到端口连接的图表。请查找 Syncfusion Diagram 的在线示例。我们创建了类似于提供的屏幕截图的流程图。

请参考以下链接中的示例：

示例链接：https : //codesandbox.io/s/wkvjjopv18

您还可以使用注释属性为节点或连接器创建标签。请找到以下链接，了解如何向节点或连接器添加标签

链接：https : //ej2.syncfusion.com/react/documentation/diagram/labels#create-annotation

没有很多专门为 React 构建的流和图表库。您还应该寻找与 React 很好地集成的通用解决方案。

如果这是在商业环境中和/或您的要求非常重要，请务必查看yFiles for HTML，它应该能够帮助您实现我在示例图中可以看到的所有要求：

• 您可以自定义可视化的设计和外观，以完全符合您的要求
• 您可以使用自动布局算法根据数据的结构动态排列项目，而无需用户手动放置项目
• 您可以向节点和边添加任意数量的标签、端口（节点处的连接器）。
• 您可以自定义交互，例如禁止在您的图表类型中创建无效结构
• 它是一种白标解决方案，可以嵌入到任何 JavaScript 应用程序中。

该库可帮助您创建react图表组件，并附带一个react图表集成演示。这允许您使用React 驱动的应用程序中的所有功能。请参阅此完整的图表编辑器应用程序以获取复杂的演示，其中显示了该库的许多功能。

^{免责声明：我为创建上述库的公司工作。不过，我在 SO 上不代表我的雇主。答案、问题和意见都是我自己的。}