javascript - redux-thunk有什么用？

问题描述

问 题

我知道是处理异步的，但是他是怎么做到的，看项目代码没看明白

解决方案

function createThunkMiddleware(extraArgument) {
  return ({ dispatch, getState }) => next => action => {
    if (typeof action === 'function') {
      return action(dispatch, getState, extraArgument);
    }

    return next(action);
  };
}

const thunk = createThunkMiddleware();
thunk.withExtraArgument = createThunkMiddleware;

export default thunk;

这是redux-thunk所有的源代码，默认情况下redux只能dispatch一个plain object，例如：

dispatch({
    type: 'SOME_ACTION_TYPE',
    data: 'xxxx'
});

使用 redux-thunk 之后，可以dispatch一个函数了，这个函数会接收dispatch, getState作为参数，在这个函数里你就可以干你想干的事情，在任何地方随意dispatch了，例如下面这个ajax请求：

dispatch(function (dispatch) {
    $.get('/api/users', function(users) {
        dispatch({
            type: 'FETCH_USERS_SUCCESS',
            users: users,
        });
    });
});

这篇关于javascript - redux-thunk有什么用？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！