Javascript Redux:调用相同的api,但分派不同的操作

Javascript Redux:调用相同的api,但分派不同的操作,javascript,reactjs,redux,Javascript,Reactjs,Redux,目前我有一个redux actions,它是getUsers(),用于获取所有用户 export function getUsers (params) { return async dispatch => { await dispatch({ type: 'GET_USERS_REQUEST' }); const urlParams = params ? new URLSearchParams(Object.entries(params)) :

目前我有一个redux actions,它是
getUsers()
,用于获取所有用户

export function getUsers (params) {
    return async dispatch => { 
        await dispatch({ type: 'GET_USERS_REQUEST' });

        const urlParams = params ? new URLSearchParams(Object.entries(params)) : null;

        return axios({
            method: 'get',
            url: Environment.GET_USERS+ `?${urlParams}`,
            headers: { 'Content-Type': 'application/json' },
        }).then (async res => {
            await dispatch({ type: 'GET_USERS_SUCCESS', allUsers: res.data.Data });
        }).catch (err => {
            dispatch({ type: 'GET_USERS_FAILURE', error: err.toString() });
        });
    }
}
现在我想使用相同的
getUsers()
,但是使用参数id(例如
getUsers({UserId:'jamesbond007'})
), 在这个动作中,我想
分派({type:'GET\u USER\u BY\u ID\u SUCCESS',USER:res.data.data})


如何使用相同的api调用分派不同的操作?我是否应该复制相同的代码,但更改动作调度?如果这样做,它将变成重复功能。

您可以通过参数id决定操作,如

// all users, paramId is null
// a user, paramId is xxxx
const action = paramId ?
     { type: 'GET_USER_BY_ID_SUCCESS', user: res.data.Data } :
     { type: 'GET_USERS_SUCCESS', allUsers: res.data.Data };
dispatch(action);

但是,我认为你的想法不好。最好用两种方法进行逻辑运算。它是可读的。

我找到了这样做的方法。我声明变量
REQUEST、SUCCESS、FAILURE
,并检查param对象是否包含
UserId
。如果是,它将通过_ID而不是
获取用户
来调度
获取用户

export function getUsers (params) {
    let REQUEST, SUCCESS, FAILURE;

    if (!_.isEmpty(params) && params.UserId) {
        REQUEST = 'GET_USER_BY_ID_REQUEST';
        SUCCESS = 'GET_USER_BY_ID_SUCCESS';
        FAILURE = 'GET_USER_BY_ID_FAILURE';
    } else {
        REQUEST = 'GET_USERS_REQUEST';
        SUCCESS = 'GET_USERS_SUCCESS';
        FAILURE = 'GET_USERS_FAILURE';
    }

    return async dispatch => { 
        await dispatch({ type: REQUEST });

        const urlParams = params ? new URLSearchParams(Object.entries(params)) : null;

        return axios({
            method: 'get',
            url: Environment.GET_USERS+ `?${urlParams}`,
            headers: { 'Content-Type': 'application/json' },
        }).then (async res => {
            await dispatch({ type: SUCCESS, payload: res.data.Data });
        }).catch (err => {
            dispatch({ type: FAILURE, error: err.toString() });
        });
    }
}
请注意,在我的减速器中,我只使用
action.payload
。例如:

case 'GET_USERS_SUCCESS':
    return { ...state, isFetching: false, userList: action.payload };

case 'GET_USER_BY_ID_SUCCESS':
    return { ...state, isFetching: false, user: action.payload };