在 redux saga 中的异步函数之后做一些工作答案

【问题标题】：do some works after asynchronous function in redux saga在 redux saga 中的异步函数之后做一些工作
【发布时间】：2018-05-04 08:11:12
【问题描述】：

我正在使用 redux-saga 进行项目。我之前使用过 thunk，所以我可以在 api 请求之后做一些工作，例如，

componentDidMount(){
  login().then((success)=>{
    redirectToProfilePage();
  })
}

因为 redux-thunk 中的操作返回承诺。但是当我尝试在 redux-saga 中执行此操作时，我不能使用 then 因为 saga 不会返回承诺。

所以我正在使用 componentWillReceiveProps 来解决这个问题，但我认为这不是一个合适的解决方案。

我应该在 saga 生成器中做这项工作吗？或者有没有其他更好的方法？

【问题讨论】：

在您的组件中创建生成器函数并通过调度的动作调用它。

标签： reactjs redux redux-saga

【解决方案1】：

为了充分利用 Sagas 的潜力，您需要在 componentDidMount 中调度一个动作。

在该组件的 sagas.js 文件中，创建一个函数生成器来监听 componentDidMount 中的操作：

function* listenForLoginAction(){
    yield takeLatest('LOGIN_ACTION', loginSaga)
}

然后您的 loginSaga 将按照您告诉它的顺序处理异步内容。您的 loginSaga 可能如下所示：

function* loginSaga(action){
    try{
        const loginResponse = yield call(loginFunc, varsForloginFunc)
        yield put({type: 'LOGIN_SUCCESS', loginResponse})
    } catch (error) {
        yield put({type: 'LOGIN_FAIL', message: error.message})
    }
}

使用yield call 和yield put，结合使用takeLatest 或takeEvery 监听特定操作，允许您编写等待执行的代码，直到上面的行完成。

希望有帮助！！

【讨论】：

感谢您的帮助。但我认为这不是我要问的。在完成异步操作后，我想在调度操作的组件中做一些工作。
@AnandS 抱歉回复晚了。我正在尝试在异步工作完成后设置状态。或者滚动到某个元素。