如何根据传奇处理程序的响应在屏幕上显示消息

Question

联系 Saga 处理程序

export function* handlePostContactUser(action) {
    try {
        yield call(axios.post, '*endpoint*', action.data);
    } catch (error) {
        throw error;
    }
};

前端表单handleSubmit函数：

let handleContactFormSubmit = () => {
     let name = input.name;
     let email = input.email;
     let message = input.message;
     dispatch({ type: 'POST_CONTACT_USER', data: {name, email, message, date}});
}

RootSaga

export function* watcherSaga() {
    yield all([
       takeEvery("POST_CONTACT_USER", handlePostContactUser)
    ]);
};

根据这段代码，如何在表单提交后根据成功与否在前端显示消息？如果是，则仅 redirect/refresh 页面，如果不是，则在屏幕上显示错误以供用户查看

Answer 1

由于 sagas 基本上是生成器，您需要做的是在 yield call(axios) 之后触发一个动作。以这种方式更改商店并在您的组件中获得结果。

为了处理错误，在 catch 块中放置一个动作来做同样的事情。

export function* handlePostContactUser(action) {
    try {
        yield call(axios.post, '*endpoint*', action.data);
        yield put('MY_SUCCESS_ACTION')
    } catch (error) {
        yield put('MY_ERROR_ACTION')
    }
};

像这样更新商店，然后在组件中获取您需要的商店属性。

如何根据传奇处理程序的响应在屏幕上显示消息

How to display a message on screen depending on the response from a saga handler

reactjs

redux

redux-saga