假设我有两个反应组件。
组件A是网站所有者可以添加到其网站的电子商务商店。这包含商店产品，网站访问者可以选择要添加到购物车的商品。
组件B是购物车组件，网站所有者可以选择添加到其网站的标题中。
我想解决的基本用例如下：
在网站上，A和B等组件被称为“插件”。当主站点呈现其页面时，它将运行一个要在页面上呈现的插件列表。每个插件彼此独立。
我的问题是，有没有办法让其中两个插件传递到同一个商店，或订阅同一个商店，而不与主要的父组件进行交互？
如果无法做到这一点，我的下一个解决方案是将组件A和B放在容器组件X中.X将是一个包含状态和业务逻辑的提供者。 A和B只包含视图逻辑。 X将呈现为插件，但在页面上不可见，并管理A和B的状态。
如果我采用这种容器方法，有没有办法从容器中提取A和B，这样我们可以在它们链接到同一个商店后独立呈现它们？
答案 0 :(得分：0)
我使用ReactJS使用Reflux或Redux（我推荐更多）做了类似的事情。
基本上我会将购物车和电子商务商店分成两个与Redux商店直接联系的智能或容器组件。
在Redux中，我们有一个数据存储，但我们可以有多个reducer（商店内部基本上是不可变的对象）。
这将是流程：
1）用户通过单击产品将产品添加到购物车。 2）组件A发送更新购物车的操作 3）Redux商店更新了购物车项目，这会触发购物车向组件B添加新项目，因为我们刚刚向商店添加了一个新对象。 this.state = {shoppingCartItems：[{id：1，name：item1，price：$ 29.00}]}
基本上，在Redux中，您将在一个商店中拥有两个reducer。一个用于商店（跟踪所有产品）和一个用于购物车（跟踪所有当前添加的项目）。
这是另一个Redux示例，您可以从购物车示例中获取灵感
https://github.com/reactjs/redux/tree/master/examples/shopping-cart