如何在另一个 redux-saga 的末尾调用一个 saga，就像 redux-thunk 中的异步等待

Question

我有两个 saga，一个获取城市，另一个是这些城市的天气预报（根据 ID 专家），我怎样才能使第二个 saga 在第一个 saga 结束时处理？调用我的传奇的方法：

async componentDidMount() {
    this.props.navigation.setOptions(this.navigationOptions);

    //sagas call
   
        await this.props.fetchCities();
        await this.fetchForecastsHandler(this.props.userCities);
  }
 ...some code
 fetchForecastsHandler(cities: ICIty[]) {
    const ids = cities.map((el) => el.id);
    this.props.fetchForecasts(ids);
  }``


...some code
   render(){...}

我的 index.ts 传奇

export function* mySaga() {
    yield takeEvery(types.FETCH_USERS_CITIES, fetchUserCitiesWorker);
    yield takeEvery(types.REMOVE_CITY, removeUserCitiesWorker);
    yield takeEvery(types.SEARCH_CITY, searchUserCitiesWorker);

    yield takeEvery(types.FETCH_FORECAST, fetchForecastWorker);

    yield takeEvery(types.ADD_NOTIFICATION, addNotificationWorker);
    yield takeEvery(types.EDIT_NOTIFICATION, editNotificationWorker);
    yield takeEvery(types.DELETE_NOTIFICATION, deleteNotificationsWorker);
    yield takeEvery(types.FETCH_NOTIFICATION, fetchNotificationsWorker);
}

**FeychCityWorker saga:**


 export function* fetchUserCitiesWorker(callback?:any) {
    try {
        yield put({ type: types.FETCH_USERS_CITIES_START });
        //const user = yield call(Api.fetchUser, action.payload.userId);
        yield delay(2000,true)
        yield put({ type: types.FETCH_USERS_CITIES_SUCCESS, payload: userCities });
        console.log("fetchUserCitiesWorker worked sucess")
        //callback?callback():null
    } catch (e) {
        yield put({ type: types.FETCH_USERS_CITIES_ERROR, error: e.message });
    }
}

**also storage settings just in case:**
    
const sagaMiddleware = createSagaMiddleware()

export const store = createStore(
  reducer,
  applyMiddleware(sagaMiddleware)
)
export const action = (type:string) => store.dispatch({type})

sagaMiddleware.run(mySaga)

Answer 1

您可以将 componentDidMount 更新为仅呼叫 this.props.fetchCities。更新您的观察者函数 mySaga 以包含

{
  ...,
  yield takeEvery(
    [FETCH_USERS_CITIES_SUCCESS],
    fetchUserCitiesWorker,
  )
}

这将使 FETCH_USERS_CITIES_SUCCESS 的负载在 fetchUserCitiesWorker saga

中可用

Answer 2

可以用fork实现吗？

示例：当 saga fetchUser 完成时，您有类型 fetchUserSuccess。因此，您可以在后台运行一项任务运行随时检查获取用户是否已完成某些操作。

 function* waitFetchUserDone() {
   while (true) {
     yield take(fetchUser.SUCCESS);
     // yield something
     // to do something
   }
 }

 yield fork(waitFetchUserDone);

如何在另一个 redux-saga 的末尾调用一个 saga，就像 redux-thunk 中的异步等待

How to call one saga at the end of another redux-saga like a async await in redux-thunk

saga

typescript

reactjs

react-native

redux-saga