React Redux Saga中如何提取API Promise返回的数据并复用

问题根源 #

1. 在Generator函数里用.then()异步回调，Redux Saga无法感知这个异步操作的完成，回调里的返回值根本传不到外部变量里。
2. 使用yield call时崩溃，是因为你直接执行了getCodesById(Id)，把Promise传给了call，但call的正确用法是传递函数引用+参数，不是直接调用函数。

正确写法 #

先修正API函数的参数问题（原代码里getCodesById参数是Id，但模板字符串用了companyId，明显是笔误，先统一参数）：

// 修正API函数，确保参数正确传递
const getCodesById = (custId) => get(`${BASE_URL}/${custId}/codes`);

然后修改saga函数，用Redux Saga的call effect正确处理异步请求：

export function* getTableById(action) {
    // 获取当前客户ID
    const custId = yield select(getCurrentCustomeId);
    
    // 用call正确调用API，等待响应返回
    try {
        const response = yield call(getCodesById, custId);
        // 现在response就是API返回的数据，随便在函数里复用
        console.log(response);
        
        // 示例：把数据dispatch到redux store里
        yield put({ type: 'CODES_FETCH_SUCCESS', payload: response });
    } catch (error) {
        // 处理请求失败的情况，避免程序崩溃
        yield put({ type: 'CODES_FETCH_FAILED', payload: error.message });
    }
}

关键说明 #

• yield call(fn, arg1, arg2...)：call会帮你调用目标函数并传入参数，同时暂停saga直到Promise完成，直接把响应结果返回给你。
• 用try/catch包裹请求逻辑，能捕获API请求的错误，避免程序崩溃。
• 如果是调用getEarningCodesForCompany，同样用yield call(getEarningCodesForCompany, companyId)来处理，别再用.then()了。

内容的提问来源于stack exchange，提问作者lonelydev101