带有分派操作的Redux中间件不起作用

时间:2019-07-08 07:51:58

标签: react-redux redux-thunk redux-api-middleware

我想将Redux用于asyn,但无法正常工作。

此功能确实有效,它是一个简单的fetch

export function getDataMiddleware({ dispatch }) {
    return function (next) {
        return function (action) {
            if (action.type === GET_DATA) {
                return fetch(`https://jsonplaceholder.typicode.com/posts`)
                .then(res => res.json())
                .then(
                   data => dispatch({ type: 'DATA_LOADED', payload: data }),
                   err => dispatch({ type: 'LOAD_DATA_FAILURE', err })
                );
            }
            return next(action);
        };
    };
}

此功能不适用于

// Redux Thunk 
export function getDataMiddleware({ dispatch }) {
    return function (next) {
        return function (action) {
            if (action.type === GET_DATA) {
                return dispatch => fetch(`https://jsonplaceholder.typicode.com/posts`) // Redux Thunk handles these
                .then(res => res.json())
                .then(
                   data => dispatch({ type: 'DATA_LOADED', payload: data}),                    err => dispatch({ type: 'LOAD_DATA_FAILURE', err })
                 );
            }
            return next(action);
        };
    };
}

第二种方法有什么问题,为什么它不起作用?

0 个答案:

没有答案