Question

我的应用程序有两部分。它们每个都有自己的saga中间件，但两者都不会同时实例化。它始终是一个或另一个。例如，一个用于处理登录的传奇和另一个用于处理主页的传奇。

我想知道在我的应用的两个部分之间导航时，我应该如何拆除redux传奇。我应该让它只是垃圾收集？但是，如果仍有行动在队列中呢？这些操作仍然需要从缓冲区中刷新。

Answer 1

您可以取消关于位置更改的观察者。因此，观察者的代码将是这样的：

import { takeLatest, take, cancel } from 'redux-saga/effects';
import { LOCATION_CHANGE } from 'react-router-redux';

function* watchTheRequest() {
    const watcher = yield takeLatest('SOME_TYPE', callMySaga);
    yield take(LOCATION_CHANGE);
    yield cancel(watcher);
}

因此，当您从一个部分移动到另一个部分时，观察者将被取消。当您移动到该路线时，您可以重新注入观察者。

Answer 2

我尝试了各种解决方法，但都失败了最后 //进行临时动作及其相应的reduceor //我的reducer的默认值是false，并且在执行它的action（从不）时，它会是true

在watchSaga中-即您的saga文件的导出默认功能，这是您在saga的index.js中导入并在 rootSaga

中调用的功能

export function* setTopHeadlinesSAGA() {
    const loadBool = yield select(getloadBool);
    while (!loadBool) {
        yield take(SET_TOP_HEADLINES)
        yield call(handleTopHeadlines)
    }
}

她使用take和call而不是takeEvery / takeLatest，因为与takeEvery和takeLatest不同，take需要一个循环（ while（true））来继续执行操作而无需显式调用

refer : https://redux-saga.js.org/docs/advanced/FutureActions.html

因此，您一次只能获得一个输出

Answer 3

您可以取消从task返回的middleware run function，这将停止所有子项。

这是一段代码摘录，其中包含在卸载组件时取消任务的示例：

const sagaMiddleware = createSagaMiddleware();
const store = createStore(
  reducer,
  compose(applyMiddleware(sagaMiddleware)),
);
const sagaTask = sagaMiddleware.run(saga);

const App = () => {
  useEffect(() => {
    return function componentWillUnmount() {
      sagaTask.cancel();
    };
  });

  return (
    <Provider store={store}>
      <div>Hello World</div>
    </Provider>
  );
};

在问题注释中还有一个related question，带有更多信息。

如何停止/结束/拆除redux传奇？

3 个答案: