Question

我在网上发现了类似的问题，但是通过redux-thunk调用store.dispatch()操作时没有解决方案。

我有以下action：

export class DBActions {
  static startDatabase(): ThunkAction<Promise<void>, {}, IClientState, AnyAction> {
    return async (dispatch: ThunkDispatch<{}, {}, AnyAction>, getState: () => IClientState): Promise<void> => {
      return new Promise<void>((resolve) => {
        dispatch(DBActions.connectDatabase())
        setTimeout(() => {
          let connection: (Connection | undefined) = getDBConnection(getState())
          if (connection) {
            dispatch(DBActions.getImports(connection))
            resolve()
          }
        }, 2000)
      })
    }
  }
}

当通过mapDispatchToProps添加到组件中时，此方法可以正常工作，但在定义store.ts之后在我的store内部直接调用时，则没有问题。 store.dispatch(DBActions.startDatabase())导致：

TS2345: Argument of type 'ThunkAction<Promise<void>, {}, {}, AnyAction>' is not assignable to parameter of type 'AnyAction'.
  Property 'type' is missing in type 'ThunkAction<Promise<void>, {}, {}, AnyAction>'.

感谢您的帮助和建议！

Answer 1

避免错误消息的一种简单解决方法-尽管它不是解决方案，但它是：

dispatch<any>(DBActions.getImports(connection))

Answer 2

您可以使用 TypeScript 的 Declaration Merging 扩展 Dispatch 的 redux 接口。使用 Dispatch 重载签名扩展 ThunkDispatch 接口。然后 store.dispatch() 方法可以调度异步操作。

store.ts：

import { applyMiddleware, createStore } from 'redux';
import thunk, { ThunkAction } from 'redux-thunk';
import { DBActions } from './action';

declare module 'redux' {
  interface Dispatch<A extends Action = AnyAction> {
    <S, E, R>(asyncAction: ThunkAction<R, S, E, A>): R;
  }
}

const store = createStore((state) => state, applyMiddleware(thunk));

// dispatch async action
store.dispatch(DBActions.startDatabase()).then(() => {
  console.log(store.getState());
});

// dispatch sync action
store.dispatch(DBActions.connectDatabase());

包版本：

"redux": "^4.1.0",
"redux-thunk": "^2.3.0"
"typescript": "^4.2.4"

Answer 3

我不确定这是否是正确答案。以下是我的代码：

$color = '#'.substr(dechex($crew->color), -8);

redux-thunk：通过store.dispatch（）调用操作时缺少属性“类型”

3 个答案: