Javascript Flux：如何处理生成其他依赖对象的对象

上下文：我们正在使用React/Alt.js构建一个复杂的3D“模拟人生”web应用程序。用户可以在3D场景中添加简单对象（立方体），但更常见的情况是，他们会添加我们称之为“预制体”的东西，这是基于某些用户参数（长度、高度等）的几个简单对象（15个立方体构成一个结构）的组合

因此，我们有一个ObjectStore，包含所有简单对象和PrefactStore（只保存用户的参数以生成预置）

我们只能在React层中生成这个预置及其对象（这样预置渲染总是与存储中预置的参数同步），但出于技术原因，我们需要所有这些预置的简单对象真正存在于存储层中。换句话说，我们需要在存储中生成预置的对象（ObjectStore，因为它是存储简单对象的地方）

问题是：在哪里（存储层中），何时以及如何生成预制件及其所有从属对象，以及我们应该在哪里存储生成的对象，知道：

当预置的参数更新时，我们需要重新生成和更新对象（现有对象可以移动、旋转、完全移除）

我们无法在React视图层中计算Prefact生成的对象，因为我们需要在存储层中使用这些生成的对象（因为这些对象可以与其他对象交互，我们在使用所有现有对象生成文件时也需要它们）

生成预置及其依赖对象是一项复杂而缓慢的任务：我们不能在每次需要渲染预置时调用这个生成函数。此外，正如我在前一点中所帮助的，我们需要一个对生成对象的引用，以便它们必须存在于存储中

为了帮助理解什么是预制件和简单对象，以及为什么我们需要预制件的对象存在于存储层中，以下是我们应用程序的屏幕截图：

我的解决方案：

在React组件中动态生成预设和从属对象

优点：预制渲染和从属对象始终与预制的数据同步。当预置的参数被更新时，会自动地对预置进行反应，并再次生成对象

缺点：对象实际上并不存在。它们不在ObjectStore中，因此我无法与它们交互（显示对象列表，生成包含所有对象的文件，…）

生成预置和相关对象一次，然后用生成的对象填充相关存储（ObjectStore，PrefactStore）

优点：所有对象都存储在自己的存储中

缺点：当您更新预置（移动/旋转/调整大小）时，很难更新所有相关生成的对象，并且您需要ObjectStore中的一组store lsitener来确保对象与它们所属的预置同步

动态生成预置对象和从属对象，但要在存储中进行记忆。 优点：依赖对象始终处于同步状态+存储层中确实存在对象（不确定如何在两个不同的存储中处理此备忘录：PrefactStore和ObjectStore）

---

缺点：我不知道如何在两个不同的存储中处理记忆：预制对象的预制存储（仍然具有位置/旋转属性）和生成对象的对象存储

回答这类体系结构问题很难——你是自己系统和领域的专家，但不管怎样：

基本的流量规则是，存储负责改变自己的状态以响应某个操作。此外，还有良好的通用代码组织实践，例如具有低耦合和高内聚性等

一种选择是：

某种预制模型对象，它知道 一个预制“模板”，并有一个生成方法来创建和返回 适当的对象（可能generate方法必须采用一些位置信息或某些参数）。预制模型可以在单独的代码模块中与任何存储解耦。如果您愿意，generate方法可以是一个纯函数，在它自己的模块中

预制存储可以直接存储预制模型（可能最简单），或者只存储构建它们所需的数据

对象存储区有一个ADD_FROM_PREFAB操作的处理程序，用于查询预制存储区中的适当预制模型数据/实例、调用 在其上生成，并最终将返回的对象添加到其状态中

UI然后只从ObjectStore渲染场景，而不是预制存储（虽然预制存储可能也用于预制库UI？）

---

通过这种方法，您可以独立地对预制模型和对象生成进行单元测试，并在您想要的地方轻松地重用它。存储代码也是相当简单的胶水，易于测试。UI不需要担心渲染部分中的预置。

我不确定flux的实现，但如果您使用Redux（即使您没有），这是一种有效处理计算数据的常见模式（特别是在回答第3点）。只要需要对象的引用，就可以

导入

选择器。这使您的状态保持简单并优化了计算。谢谢您的回答。实际上，我现在正在使用这个选项（好吧，几乎相同，请参阅我的原始帖子中的解决方案2）：我有一个预制模型，它生成所有依赖对象，然后所有依赖存储（ObjectStore）侦听“预制生成的”动作，获取生成的对象并将它们放在自己的存储中。我对这个解决方案不满意，因为当我更新预置（参数、位置等）时，我需要更新所有依赖对象（完全移动/调整大小/删除），也就是重新生成预置。如何确保对象始终与预置参数同步？一个选项是