如何确保数据在 Redux Saga 中不被加载两次？

Question

比方说，我有一个带有 Redux 和 Redux-Saga 的简单 React 应用程序。我想加载一些数据，但要确保数据不会加载两次。将多次请求数据。

我天真的实现如下：

function* loadMyData() {
    const isMyDataLoaded = yield select(isMyDataLoadedSelector);
    if (!isMyDataLoaded) {
        yield call(loadMyData);
    }
}

有更好的方法吗？

Answer 1

有很多方法可以实现这一点，包括您提到的方法 - 我觉得很好。

另一种方法是只等待一次加载操作：

function * loadMyDataSaga() {
   yield call(loadMyData);
}

function * watcher() {
    yield take(ACTIONS.LOAD_DATA);
    yield fork(loadMyDataSaga);
}

take 效果 - 与 takeEvery 不同 - 只会等待 LOAD_DATA 动作一次。 LOAD_DATA 的任何后续调度都将被忽略。

除了 redux/redux-saga 层之外，您还可以在 loadMyData 之上实现某种记忆缓存。如果您从 sagas 以外的其他地方加载数据，这将很有用。

如何确保数据在 Redux Saga 中不被加载两次？

How to ensure data is not loaded twice in Redux Saga?

reactjs

redux

redux-saga

react-redux