两个组件结合VUEJ

Question

如何完美地组织两个VUEJ组件之间的数据和相互作用？例如：1）我有一个组件

item(v-for="item in items)
 a {{item.name}}

2）和第二个

card(v-for="item in items")
 div.content
  img {{item.photo}}
  div {{item.desc}}
  button Details

主要想法是当我单击列表项目时，我想用与列表相同的ID切换卡。我使用VUE WebPack模板中的一个文件综合管理。

Answer 1

许多人似乎在试图在没有商店的情况下使用vue。你能成为其中之一吗？也许是因为商店并不是Vue的一部分？也许是因为文档在亲子交流，事件等上花费更多的时间（复杂）（简单）？也许是因为oo腐烂了我们的大脑？

Vue想与商店交谈。双向结合的整个点是将状态与标记分开。这么天才的想法的全部原因是，许多州的项目（大多数？）项目在屏幕上有多个表示形式，例如您的项目数组。您的商店可以像窗口范围中的JS对象一样简单，在给定时刻应包含您的所有页面状态。您应该能够在页面之间复制商店，并在屏幕上查看同一内容。商店的重要素质是...

• 其中只有一个。
• 您将商店"归一化"，以便一个状态物品仅存储一次，并且状态项目之间的依赖关系最少。

您的项目数组应该在商店中，并且两个组件都涉及此"真实的单一来源"。如果您使用其他人的组件，则需要为它们提供一些属性，但是属性是通过VUE组件创建隧道，以将叶子组件与您的商店联系起来。您的物品是您的状态，状态通常不应生活在Vue中。这有帮助吗？