Javascript 如何使用flowtype绑定异步操作创建者？

我刚开始学习flowtype，我需要一些帮助来理解我头脑中不清楚的两件事

作为一个例子，我想知道在没有类型定义的情况下，如何控制类型，在本例中：

如果我使用redux定义，当我尝试绑定异步操作创建者时，

bindActionCreators

的验证会失败（我使用的是redux-thunk）

在使用redux thunk时，如何继续使用流和绑定异步操作创建者

代码示例（）：

从'redux'导入{bindActionCreators}；
从“redux”导入类型{Dispatch}；
类型操作={type:'SET_PROFILE'，PROFILE:Object}；
/**
*基于https://github.com/gaearon/redux-thunk/blob/master/index.d.ts
*/
类型ThunkAction=（分派：分派，
getState:（）=>任何，
外部参数：any）=>any；
类型配置文件={
名称：string，
团队：字符串
}
//异步操作创建者
函数集配置文件（配置文件：配置文件）：ThunkAction{
返回dispatch=>setTimeout（（）=>dispatch（{type:'SET_PROFILE'，PROFILE}），2000）；
}
const profileActionCreators={setProfile}；
类型道具={
行动：{
setProfile：（profile:profile）=>ThunkAction，
}
}
函数mapDispatchToProps（分派：分派）：道具{
返回{
操作：bindActionCreators（profileActionCreators，调度）
};
}

错误：

 40:     actions: bindActionCreators(profileActionCreators, dispatch)
                  ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ function call. Function cannot be called on any member of intersection type
 40:     actions: bindActionCreators(profileActionCreators, dispatch)
                  ^^^^^^^^^^^^^^^^^^ intersection
  Member 1:
   49:   declare function bindActionCreators<A, C: ActionCreator<A, any>>(actionCreator: C, dispatch: Dispatch<A>): C;
                                            ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ polymorphic type: function type. See lib: flow-typed/npm/redux_v3.x.x.js:49
  Error:
   49:   declare function bindActionCreators<A, C: ActionCreator<A, any>>(actionCreator: C, dispatch: Dispatch<A>): C;
                                                   ^^^^^^^^^^^^^^^^^^^^^ function type. Callable signature not found in. See lib: flow-typed/npm/redux_v3.x.x.js:49
   40:     actions: bindActionCreators(profileActionCreators, dispatch)
                                       ^^^^^^^^^^^^^^^^^^^^^ object literal
  Member 2:
   50:   declare function bindActionCreators<A, K, C: ActionCreators<K, A>>(actionCreators: C, dispatch: Dispatch<A>): C;
                                            ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ polymorphic type: function type. See lib: flow-typed/npm/redux_v3.x.x.js:50
  Error:
   13:   declare type Dispatch<A: { type: $Subtype<string> }> = (action: A) => A;
                                  ^^^^^^^^^^^^^^^^^^^^^^^^^^ property `type` of object type. Property not found in. See lib: flow-typed/npm/redux_v3.x.x.js:13
   21: function setProfile(profile: Profile): ThunkAction {
                                              ^^^^^^^^^^^ function type

40:操作：bindActionCreators（profileActionCreators，调度）
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^函数调用。无法对交叉点类型的任何成员调用函数
40：操作：bindActionCreators（profileActionCreators，调度）
^^^^^^^^^^^^^^^^^^交叉口
成员1：
49：声明函数bindActionCreators（actionCreator:C，dispatch:dispatch）：C；
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^多态类型：函数类型。参见lib:flow-typed/npm/redux_v3.x.x.js:49
错误：
49：声明函数bindActionCreators（actionCreator:C，dispatch:dispatch）：C；
^^^^^^^^^^^^^^^^^^^^^函数类型。在中找不到可调用签名。参见lib:flow-typed/npm/redux_v3.x.x.js:49
40：操作：bindActionCreators（profileActionCreators，调度）
^^^^^^^^^^^^^^^^^^^^^对象文字
成员2：
50：声明函数bindActionCreators（actionCreators:C，dispatch:dispatch）：C；
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^多态类型：函数类型。参见lib:flow-typed/npm/redux_v3.x.x.js:50
错误：
13：声明类型分派=（操作：A）=>A；
^^^^^^^^^^^^^^^^^^^^^^^^^^对象类型的属性“type”。在中找不到属性。参见lib:flow-typed/npm/redux_v3.x.x.js:13
21：函数设置配置文件（配置文件：配置文件）：ThunkAction{
^^^^^^^^^^^功能类型

以下是ActionCreator和BindActionCreator的完整声明：

  declare type ActionCreator<A, B> = (...args: Array<B>) => A;
  declare type ActionCreators<K, A> = { [key: K]: ActionCreator<A, any> };

  declare function bindActionCreators<A, C: ActionCreator<A, any>>(actionCreator: C, dispatch: Dispatch<A>): C;
  declare function bindActionCreators<A, K, C: ActionCreators<K, A>>(actionCreators: C, dispatch: Dispatch<A>): C;

因此，在您的代码中，它实际上如下所示：

function bindActionCreator(actionCreator, dispatch) {
  return (...args) => dispatch(actionCreator(...args))
}

function mapDispatchToProps(dispatch: Dispatch<Action>): Props {
  return {
    actions: {
      setProfile: (profile) => dispatch(dispatch => setTimeout(() => dispatch({ type: 'SET_PROFILE', profile }), 2000)),
  };
}

Thunk方法 如果您想保持ThunkAction方法，您将无法使用bindActionCreators

function mapDispatchToProps(dispatch: Dispatch<Action>): Props {
  return {
    actions: {
      setProfile: (profile) => dispatch(dispatch => setTimeout(() => dispatch({ type: 'SET_PROFILE', profile }), 2000)),
  };
}

const profileActionCreators = { setProfile };

type Props = {
  actions: {
    setProfile: (profile: Profile) => setTimeout,
  }
}

function mapDispatchToProps(dispatch: Dispatch<Action>): Props {
  const boundActions = bindActionCreators(
    profileActionCreators,
    dispatch
  );
  return ({
    actions: {
      setProfile: (profile: Profile) => setTimeout(() => boundActions.setProfile(profile), 2000),
    },
  });
}