我正在开发我的第一个广泛的 MERN 项目，部分功能涉及特定组件（如复选框待办事项列表、图像、文本、et...），然后允许用户构建不同的页面、更大的多复选框聚合列表等......把它想象成类似https://www.notion.so/notes 的东西。
构建单独的 React 组件并在静态页面上配置它们很简单。但是，我很难从概念上理解如何使用这些组件，然后动态地允许用户使用它们构建自定义页面。
从广义上讲，页面构建器在功能上是如何工作的？
这是一个广泛的想法。您将需要一个页面，其中左侧列出所有 UI 组件 [重击钉]，右侧区域用于拖放这些组件。您将需要一个包含行和列组件的网格系统，例如 Bootstrap Grid 或 MUI Grid，将空间划分为 12 个部分，用于任何页面的布局。你应该让每个被丢弃的组件提供一个选项来接受它的 props，这样用户就可以设置它。设置道具可以是另一个组件。
当他们保存设计时，您应该获得他们正在保存的内容以及所有属性的反应组件树，并将其保存在您的数据库中。您应该能够使用这些保存的数据生成设计视图和实际视图。
说起来很容易，但我知道这是很多工作。我见过使用 Angular 和 .NET 完成的类似工作。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句