Question

假设我有一个动作：

export const getInfoFor = user => {
    return dispatch => {
        dispatch( fetchApi(user) );
    }
}

const fetchApi = user => dispatch => {
    return( dispatch({type: SET_USER}) )  <--- ??
}

我的问题是，dispatch是如何传递到return中的fetchApi的？也许让我失望的是fetchApi中的双箭头功能。

该代码有效，但是我想了解它为什么有效。

Answer 1

您的顶级功能被Redux-Thunk中间件拦截并传递给dispatch, getState, customValues。

自定义值的示例（来自redux-thunk github）

const store = createStore(
  reducer,
  applyMiddleware(thunk.withExtraArgument(api))
)

// later
function fetchUser(id) {
  return (dispatch, getState, api) => {
    // you can use api here
  }
}

因此，简而言之，当您返回函数时，它来自Redux-Thunk中间件。

https://github.com/reduxjs/redux-thunk

https://github.com/reduxjs/redux-thunk/blob/master/src/index.js（由@Nicholas Tower提供）

Answer 2

Redux thunk是一个小型中间件，它检查分发到商店的EmailOptions(OptionsVm emailOptions)中的// controller public class AController : Controller { ... public ActionResult EmailOptions() { ... return View( new OptionsVm { DomainObj = new DomainObj() } ) } [HttpPost] public ActionResult EmailOptions(OptionsVm vm) { ... // don't do anything with the actually passed in OptionsVm return View( new OptionsVm { DomainObj = new DomainObj(), StringContent = "some message" } ) } } // viewmodel public class OptionsVm { public BooleanObjs DomainObj { get; set; } public string MessageSometimes { get; set; } }。如果typeof操作是action，则中间件调用该函数，并将dispatch作为参数传递。

您可以看到源代码here

React Redux分派语法

2 个答案: