如何同步更新我的 redux store？

Question

我有一个函数在很短的时间内被分派了两次。假设第一次调用准时 X，第二次调用准时 Y。其中 Y > X 且 X 和 Y 之间的差异为 5 毫秒 或更短。

在时间 Y 进行的调用首先更新商店，然后在时间 X 进行的调用。所以我的商店正在更新过时的数据。如何克服这种情况？

我正在使用 redux-thunk。

Answer 1

我假设你的问题是第一个异步调用的结果到达在第二个异步调用（具有优先级）的结果已经到达之后。

处理此问题的总体思路是，您需要能够跟踪 latest/most 最近的调用，而不是其他应忽略且不再影响状态的过时调用。

要解决此问题，请将 Date.now() 的值保存在您的状态中，以记住 最近的请求 何时开始。在 thunks 中，您可以访问 getState，因此您可以检查当前请求是否仍然是最近启动的请求。

伪代码：

const myThunk = () => async (dispatch, getState) => {
    const startedAt = Date.now();

    // this needs to write state.mostRecentRequestStartedAt = action.payload.startedAt; in the reducer
    dispatch(requestStarted(startedAt));
    
    const result = await doSomethingAsync();

    // At this point, other more recent requests might have started!
    const { mostRecentRequestStartedAt } = getState();
    if (startedAt === mostRecentRequestStartedAt) {
        dispatch(saveResult(result));
    } else {
        // result is from an outdated request. Ignore it or do something else here.
    }
};

如何同步更新我的 redux store？

How to update my redux store synchronously?

reactjs

redux

redux-thunk