我正在构建一个Angular 2 ngrx / store应用程序并试图了解最佳实践。
- 我喜欢一个不可变状态,它只根据调度的动作进行更改,以便应用程序状态非常清晰且可调试。
- 我喜欢从“智能”容器中向下流动的单向数据,因为这样我们就可以使用异步管道来减少对状态的检查。
但是我不明白为什么在将动作发送到商店之前我们想要将事件从哑组件“冒泡”到智能组件。是否有可重复使用组件的唯一原因?在我看来,大多数组件都不会被重复使用,因为在我想要包含CSS的所有内容完全相同的情况下并不多。我还缺少其他任何好处吗?从可维护性/可读性的角度来看,能够直接看到在发生交互的组件上发送的操作不是更好吗?
我完全同意你的观点,我有同样的疑问。
我希望组件使用调度程序发出一个动作(用于 ngrx/store
是商店本身)而不是将此逻辑移动到容器(实际应用程序)。
这样,组件与容器分离,容器不需要知道操作:它只是监听状态更改并在必要时传递最终数据。
另一方面, ngrx / store简介 正在通过一个更智能的容器来推广设计,这个容器对底层组件有很多了解。
坦率地说, 我还没有看到一个明显的赢家:我只是认为来自组件的调度操作更简单,更清洁,更接近于 榆树建筑 这是Redux的灵感之一。
其中一个主要原因是重复使用。
就MVC而言,将您的智能组件视为您的控制器,将您的哑组件视为您的视图。
想象一个愚蠢的组件,它为你的一个实体(模型)呈现一个编辑表单。哑组件处理显示表单和验证消息,但是您可以在添加实体屏幕,编辑实体屏幕上重新使用该组件,也可以在应用程序中的其他位置重新使用弹出对话框。这些用例中的每一个都需要具有相同验证的相同形式,但您可能对“提交”执行非常不同的操作。在每种情况下,调用哑组件的智能组件可能是不同的智能组件。通过提升事件并将值传递给智能组件,您可以执行截然不同的操作,同时只编写“视图”一次。
我想扩展给定的答案。
如果说没有来自哑组件的调度操作有助于重复使用,除了允许您一次又一次地使用您刚刚创建的相同组件之外,它还可以帮助您与第三方组件集成。这些可能是开源组件,甚至是您的同事可能会开发的,这些组件不知道您使用NgRx操纵数据的方式。
这样,您可以尽可能地使代码保持通用,模块化和独立于实现。
只是为了澄清,这都是关于建议的,在某些情况下,采取不同的行动可能会更聪明,但通常最好坚持惯例。
我还没有找到任何关于“冒泡”事件的参考资料 NGRX /示例应用内。在Rob的谈话中,我还没有得到(我可能会错过一些东西)。
我只是使用所有的ngrx作为例子,现在它看起来很好。 ngrx / store用于存储数据,ngrx /效果用于链操作(我可以简化),以及“actions”图像中的“中间件”,用于描述您可以使用其中一个商店部件执行的操作。
然后,当我看起来最方便的时候我正在使用动作(我只是确保文件中使用的所有动作都与当前类相关)。