React Native：双重获取覆盖以前的数据

Question

我有一个带有两个不同选项卡的屏幕。每个选项卡都有索引 (0, 1)，并且状态保留有关当前活动选项卡的信息。每个选项卡在屏幕上显示不同的数据。 当用户点击选项卡时，数据获取开始获取选项卡的数据。 与此同时，屏幕上会出现一个加载指示器，当 fetch 获得响应时，dispatch 会更新 store 上的数据（redux）。 然后屏幕重新渲染，组件从 store 中获取获取的数据并将信息显示在屏幕上。

问题是当我们从一个选项卡快速切换到另一个选项卡时，数据获取已经在运行。 例如： - tab 0 开始一次获取它的数据，屏幕正在加载 - 我们立即切换到选项卡 1，在我们获取选项卡 0 的数据之前 - tab 1 开始一次获取它的数据，屏幕正在加载 - 根据哪个获取首先完成，我们在屏幕上显示它的响应数据 - 稍后完成的 fetch 最终会覆盖之前显示的数据

我该如何解决这个问题？ 注意：我不想在第一次提取仍在加载时禁用选项卡之间的切换。

Answer 1

您可以使用将充当开关的类属性。

当你转到选项卡 0 时，将开关设置为 0，当你转到选项卡 1 时，将开关设置为 1！

然后，在您的 fetch 中，您检查：如果 tab 0 的 fetch 完成但您的 switch 设置为 1（这意味着您返回到索引为 1 的标签），您不修改 redux 存储！反之亦然！