angular - ngrx/example-app 中的容器和组件

Question

我写信是为了询问 @ngrx 的良好做法(我猜)。几个月前我发现了 Flux 和 Redux，但最近我一直在实践中使用 @ngrx。我必须承认这是一个非常广泛但有趣的话题。

---

解释:

第一步，我使用了一些教程和官方示例应用程序存储库(可以在此处找到 -> ngrx/example-app )。@ngrx 的使用方式和简洁的代码给我留下了深刻的印象。我使用 @ngrx 基于 ngrx/example-app 创建了自己的应用程序，但我有一个重要的问题:

在示例应用程序中，您可以找到两种组件。第一个位于 src/containers 目录中，第二个位于 src/components 目录中。我知道容器使用存储，但组件的数据是通过 @Input 传递的。

---

问题:这种结构的原因是什么(对应用程序的影响)？所有应用程序组件都可以使用应用程序商店吗？

Answer 1

组件(又名哑或演示)不应该了解应用程序上下文，它们应该非常“通用”。这就是为什么他们不应该使用 NGRX 存储并保留 loosely coupled与应用程序的其余部分，并仅通过 @Input 和 @Output 与其父级通信。它允许它们在应用程序的不同部分、甚至在其他应用程序中出于不同目的而重复使用。

如果您的组件在没有访问 NGRX 存储的情况下无法工作，那么它应该是智能 容器，了解其使用的上下文并与其交互。