多文档界面中组件之间的Vuex / Emit / Watcher

时间:2018-12-31 17:51:08

标签: vue.js vuex vuetify.js

我有一个正在编写的应用程序,该应用程序包含一个多文档界面(例如Excel或VSCode等)。对于打开的每个文档,左侧都有一棵树,右侧有从该树中选择的内容的列表。

树和列表是文档页面的独立子组件,因此它们需要彼此交谈。

我的问题围绕着树节点和所选内容(列表)是否应保存在全局vuex存储中,或者在检查某些内容时是否应在树和列表之间设置事件总线。 / p>

一旦用户关闭了文档,应用程序就无需保留在树或列表上,并且应用程序中的每个文档都不会互相交谈。因此,它真的不应该在全球商店中销售。但是,这两个同级组件确实需要通话,至少要在树的选定节点上通话。

为了避免这是一个自以为是的帖子,我试图了解这种情况下的“适当的” vue / vuex设计结构是什么,也许以一种方式与另一种方式进行的利弊有关。

  • 应该使用vuex商店吗?如果是这样,树和所选节点都应该在存储中还是仅在所选节点中?
  • 在同级组件之间应该使用$ emit吗?
  • 父容器是否应该传递“选择的节点”属性以由树组件进行更新,然后将相同的属性传递给列表组件?

最后,由于这是一个多文档接口,因此我假设如果走vuex商店的路线,则必须将每个选项卡的所有树和/或列表数据保留在某个数组中。既然这些树可以容纳10,000多个元素,那么我是否想通过首先将其放入全球商店来引入问题?

0 个答案:

没有答案