当不同的组件依赖于相同的实体列表时，如何正确地管理规范化数据的删除

Question

假设你有:

• 应用程序中可用的所有书籍的分页列表。您将其包含在BooksList组件中。
• TopBooksList组件中应用程序中最受欢迎的书籍列表。

• 所有从rest api获取的数据都被规范化并保存在Redux存储中，因此您的存储看起来像这样:

  { entities: { books: { 1: { ... }, 2: { ... }, 3: { ... }, 4: { ... }, 5: { ... } } }, topBooksList: [5, 2, 1], booksList: [1, 2, 3, 4, 5] }

• 用户通过点击BooksList组件中图书的删除按钮来删除图书5

每次发生删除操作时，相应的实体将从实体列表中删除，并从该组件的结果列表中删除。

0。如果页面上有其他组件引用了刚刚删除的实体，那么最好的处理方法是什么?

1。您是否尝试通过在处理此类数据的每个reducer中添加用于删除操作的开关语句来协调组件?1.1如果是这样，如果您希望始终确保与最终受该删除影响的组件保持同步，如示例中的TopBooksList组件。通过删除图书5，您最终得到长度为2的topBooksList，您需要它的长度为3。是否以某种方式将其标记为脏数据并重新获取数据?当页面上相关组件的数量增加时，这种策略不会变得乏味吗?

2。有没有一种不同的、更简单的策略?

Answer 1

您应该在处理本书的每个reducer中添加switch case。在那里，你做了必要的事情来保持一切有序(保持引用完整性，确保顶部列表长度为3，等等)。

但是，如果这涉及到从后端获取数据，那么这应该放在deleteBook的异步操作创建器中。

这样做的原因是还原剂应该始终是纯的，这意味着它们不能有副作用。

在你的例子中，我可能有一个更长的topBooksList，所以不需要每次删除一本书时都获取。您不需要显示它们。

这个策略是不是变得乏味了组件在页面上增长?

是的，它确实变得乏味。尝试Redux-Orm或Redux-Schema(免责声明:由我编写)。