redux-saga和redux-toolkit对如何正确导航代码感到困惑

Question

我是个新手，所以这里可能缺少信息。以下传奇已注册

function* onboardingListener() {
yield takeEvery(ENROLL_CRED_STATUS_REQUEST, onboarding);
}
function* onboarding(enrollFormUsername) {
// a few lines of code that are not important 'I think'
yield put(enrollGetContactByUsername(username));
const { contactSuccess } = yield race({
contactSuccess: take(ENROLL_CONTACT_FIND_SUCCESS),
contactFailure: take(ENROLL_CONTACT_FIND_FAILURE),
});
}
export function enrollGetContactByUsername(username) {
const config = {
baseURL: ENV_VARS.BASE_URL_CONTACT,
url: '/contact/enroll',
method: 'GET',
params: {
email: `${username}`,
},
};
return {
type: 'API_CALL',
config,
auth: false,
spinner: true,
successAction: ENROLL_CONTACT_FIND_SUCCESS,
failureAction: ENROLL_CONTACT_FIND_FAILURE,
};
}

我看到ENROLL_RED_STATUS_REQUEST已经连接好了，我想这是入职将调用的开始，所以我不确定是否需要提供所有反应冗余代码。

在redux文档中，我看到了类似的代码

const token = yield call(Api.authorize, user, password)
yield put({type: 'LOGIN_SUCCESS', token})

这对我来说很有意义。我不知道上面的代码是如何调用远程服务器的，也不知道为什么在上面的代码中调用call((和fork((。上面的代码究竟是如何工作的？

Answer 1

enrollGetContactByUsername是一个操作创建者，它创建一个类型为API_CALL的新操作，然后在onboarding传奇中调度该操作。我怀疑你在某个地方有另一个传奇故事在运行和收听这个动作来处理请求。所述传奇可能与下一个片段相似，只是它使用了所提供的配置而不是Api.authorize。所以类似于：

function * apiCallSaga() {
yield takeEvery(API_CALL, function * (action) {
try {
const method = axios[config.method.toLowerCase()]
const fullUrl = config.baseURL + config.url
const {data} = yield call(method, fullUrl, config.params)
yield put({type: config.successAction, data})
} catch (err) {
yield put({type: config.failureAction, err})
}
}
}

回答你的第二个问题。当您想调用一个返回promise的函数时，可以使用call或fork。不同之处在于，生成call会等待结果——类似于异步函数中的await——因此您可以将其分配给变量以获得promise的结果。另一方面CCD_ 9是非阻塞效应；任务描述符"；这有点像传奇世界里的承诺。然后，您可以使用例如join效果来等待代码稍后的结果。在99%的情况下，当发出api请求时，您希望在发出请求的代码行中获得结果，因此您将使用call效果。