如何从不同模型引用的模型中删除记录？答案

【问题标题】：How to delete records from a model referenced by a different model?如何从不同模型引用的模型中删除记录？
【发布时间】：2021-03-08 13:22:05
【问题描述】：

我有两个模型，其中模型 A 引用模型 B 中的项目。当我从模型 B 中删除项目时，反应重新渲染，然后我可以更新模型 A 以删除引用的项目。

例子：

我有一个提要。提要由不同类型的项目组成。每种类型的项目都存储在其各自的模型中。提要订单存储为项目 ID 数组，引用其不同子存储中的项目。

我在这里做了一个最小的失败示例。点击按钮三次后出现问题

关键是

else console.error(">>>> feed order contains deleted item", id);

Feed 订单可能包含已删除的项目是有问题的，因为这可能意味着存在导致错误引用的编程错误。在这种情况下，这不是编程错误，只是第二个商店还没有更新。

有没有办法可以批量处理createAndDeleteTodo，在整个 thunk 和所有 subthunk 完成之前不评估所有侦听器？

在上面的示例中，只需一个主操作来更新提要订单和项目就足够简单了，但是如果有不止一种类型的项目，因为每种项目类型都存在于其各自的模型中，这会让人觉得很麻烦。

【问题讨论】：

【解决方案1】：

同一个 thunk 动作会触发多个动作。并且按照useStoreState的定义：

useStoreState 将在您的商店状态发生更新时执行

因此，实际上，当您在 thunk 中执行此操作时：

  actions.setTodos({ newTodos: [newTodo], todoToDelete });
  actions.updateFeedOrder({ newTodos: [newTodo], todoToDelete });

有两个动作被调度，它们将解释一个单独的存储状态更改事件监听器。您将收到多个商店更新的多个渲染调用。

你有两个选择：

或者将这些操作合二为一，如示例所示：https://codesandbox.io/s/so-deleting-referenced-items-forked-x4d7v
或检查 useStoreState 方法以了解仅当两个商店值都匹配计数时处理渲染的情况

【讨论】：

选项 1（在问题陈述中提到）和选项 2 看起来都很麻烦。数组中的一种类型是微不足道的，但如果你有很多模型，每个模型都放在这个提要中，它就会变得混乱。另请注意您的代码框 - 不要修改 thunk 中的状态“虽然您可以通过此 API 访问商店的状态，但您的 thunk 不应执行此状态的任何突变”
@david_adler 虽然不需要 Thunk 来修改状态，但类比是在一个更新存储的操作中将事物保持在一起。只能通过进行一次存储更新或仅在所需存储处于给定状态时才允许重新渲染来处理这种情况。作为最佳实践，对于给定的组件，保留一个 store 对象作为事实来源，并确保它仅在该 store 值更新时才呈现。这意味着为该视图组件创建一个嵌套对象并一次性更新它。链接多个 API 调用并在一个操作中进行更新。

【解决方案2】：

问题似乎在于您要分派到 redux 商店 2 次。首先是创建新项目时，然后是删除它们时。

我建议这样做：

这样在两个操作都完成之前不会重新渲染任何内容。

【讨论】：