reactjs - 如何知道一个函数是否在 redux thunk dispatch 中被调用？

问题描述

我正在编写一个函数来发送 API 请求。当我从该 API 获得响应时，如果用户在调度中调用了我的函数，我想调度 redux 操作，否则就什么也不做。我正在使用redux thunk。

现在我已经为此编写了两个单独的方法。

这在从 API 获得响应后不会调度，只是返回 Promise。

const getAnimalsList = () => return axios.request({url: 'api.domain.com/animals'});

这个函数将像通常的函数一样被调用。

它在从 API 获得响应后调度一个动作

const getAnimalsList = () => (dispatch, getState) => {
    axios.request({url: 'api.domain.com/animals'}).then(
        res => dispatch({type: 'RESPONSE RECEIVED', data: res}),
        err => dispatch({type: 'ERROR', err})
    );
}

这个函数将在 dispatch 内部被调用为dispatch(getAnimalsList())

现在我想在单个函数中知道它是在调度内部调用还是只是正常调用。

例子：

const getAnimalsLis = () => {
    let prom = axios.reques({url: 'api.domain.com/animals});
    if(function_is_called_inside_dispatch){
        return dispatch => {
            prom.then(
                res => dispatch({type: 'RESPONSE RECEIVED', data: res}),
                err => dispatch({type: 'ERROR', err})

            );
        }
    }
    else return prom;

}

标签： reactjsreduxredux-thunk

这是一种错误的做事方式。没有办法检测到该函数被称为 likedispatch(getAnimalsList())或 just getAnimalsList()。由于运算符的优先级，它已经被调用为getAnimalsList()当一个动作提供给dispatch. 唯一的方法是用不同的方式称呼它，dispatch(getAnimalsList(CALLED_AS_AN_ACTION)).

正确的方法是不要混合用于不同目的的功能。代码可以比原来更干燥，getAnimalsList函数已经包含可以提取的通用代码：

const getAnimalsList = () => return axios.request({url: 'api.domain.com/animals'});

const getAnimalsListAction = () => (dispatch, getState) => {
    return getAnimalsList().then(
        res => dispatch({type: 'RESPONSE RECEIVED', data: res}),
        err => dispatch({type: 'ERROR', err})
    );
}

reactjs - 如何知道一个函数是否在 redux thunk dispatch 中被调用？

问题描述

解决方案

推荐阅读