请问 redux sagas 怎么根据 router 进行懒加载？

Question

使用 redux-saga 发现 sagas 文件越写越多，如果只是进到某一个路由上，其他 sagas 就感觉很冗余。

请问 sagas 应该如何根据 router 进行关联懒加载呢？

Answer 1

你的saga是怎么写的，一个大模块一个saga.js？

还是整个项目一个saga.js？

我是用前者做的

组件内引入saga，account.login.js内：

import './saga'

saga.js内：

//其中initSaga为动态创建saga,循环判断中间件数据内，是否存在当前saga，不存在，则添加至中间件，restart run saga

initSaga({
  namespace: 'account',
  mainSaga: function* mainSaga() {
    yield fork(login)
  }
})

动态saga：

/**
 * 动态添加saga
 */
export function injectAsyncSaga(name: string, sagas: Function) {
  
  if (asyncSagas[name]) {
    return
  }
  asyncSagas[name] = sagas
  if (store) {
    sagaMiddleware.run(sagas)
  }
}

这样的话，saga就能够在你渲染某个路由组件的时候，才懒加载进来