Vue - 使用 vuex 而不是 eventbus 进行嵌套数据和组件的计算答案

【问题标题】：Vue - use vuex instead of eventbus for calculations with nested data & componentsVue - 使用 vuex 而不是 eventbus 进行嵌套数据和组件的计算
【发布时间】：2019-09-09 22:37:01
【问题描述】：

我有应用程序将大 JSON 对象绑定到组件，然后将此对象的某些部分绑定到下一个组件等 - 它的结构具有许多深层，但对象没有被复制，我利用对象通过引用传递的优势。

最低级别的组件具有“价格”、“数量”等字段。当用户修改它们时，我更新了对象并使用全局事件总线运行重新计算 - 重新计算完成后，我还使用事件总线强制更新一些组件。例如，这些字段的父级价格/qt，以刷新类别中的“总”金额。

现在我将一些代码移动到 vuex 并在这里考虑。认为提交后重新计算就可以了。问题是 - 如何使用子组件的提交来修改这个大对象？问题是提交必须“知道”对象的哪一部分已被修改（例如，许多类别之一中的一个元素）......我可以用其他方式做到这一点，在提交中传递子数据和父数据并更新父数据，但是……会起作用吗？我还需要参考才能以适当的方式做到这一点......

也许仍然使用绑定来传递元素，但调用存储操作仅进行重新计算（不确定，这会在所有必需的模块上提供自动刷新）。或者其他更好的解决方案？

【问题讨论】：

标签： vue.js reference vue-component state vuex

【解决方案1】：

我认为您在架构方面存在一些问题。这里的主要思想是拥有一些与 store (vuex) 连接的容器（智能）组件和从 props 接收数据的简单（愚蠢）组件。此外，您必须将商店划分为模块，以便维护。这种方法将允许您准确地修改您想要的数据。

【讨论】：

有可能，但无法想象如何使用 vuex 制作一些东西。例如，我有类别、内部帖子、内部 cmets。我必须使用 v-for 来显示所有类别，然后使用另一个来显示 category.posts 中的每个元素，然后还要使用 v-for 来显示每个 post.cmets。当然，category 有单独的组件，post 也有，comment 也有。并且使用 v-for + 绑定是可以的。它也可以与 vuex 一起使用，但是如果我想编辑每个元素怎么办？我的意思是猫、帖子、cmets - 使用绑定 + 引用是不好的解决方案？
尽量不要生成带有 store 绑定的 v-for 组件。 Vuex 在 pub/sub 方法上工作，所以你会得到很多很多订阅者，这对应用程序的工作不利。对于您的情况，您可以在需要的地方调用操作，只需确保将正确的数据传递给该操作。当某些子组件更新存储中的更多全局数据时，没关系。您可以在 child 内部调用 action，但随后您将需要 store 绑定，或者您将事件发送到容器元素并从那里调用 vuex 操作
是的，我知道而且我没有绑定存储，而是绑定参数 - 对象，所以它们通过引用传递，我共享数据并且不浪费内存。我只为一些额外的共享数据调用存储操作/获取存储数据。例如 - 在每个帖子中，您都选择了“作者”选项。用户列表是全局的，在 vuex 中并且不绑定，但组件从 store 中获取。