javascript - 如何在Redux-thunk中使用Redux 4.0 TypeScript绑定(bind)

我在将Redux 4.0的新TS绑定(bind)与redux-thunk结合使用时遇到麻烦。我已经通过将基本Redux "Todo List" example转换为TypeScript(repo here)，并使“添加待办事项” Action 变得笨拙而重现了这个问题。问题与报告的here相同:类型为'ThunkAction'的参数不能分配给类型为'AnyAction'的参数。
类型“ThunkAction”中缺少属性“type”。

基本上，我可以使它正常工作，但是我在一些我认为不应该使用的地方使用了any。一个地方是index.tsx#L14，在这里我将thunk中间件添加到商店:

const store = createStore(
  rootReducer,
  applyMiddleware(thunk as ThunkMiddleware<IRootState, any>)
);

如果我在那里使用any以外的任何内容，那么下一行将引发错误:

store.dispatch(addTodo('Use redux-thunk'));

另一个地方是AddTodo.tsx#L7，我在其中声明由connect函数注入(inject)的调度 Prop :

interface IAddTodoProps {
  dispatch: Dispatch<any>;
}

const AddTodo = ({ dispatch }: IAddTodoProps) => {
  ...
}
export default connect()(AddTodo);

在这两个地方，any都会覆盖必须扩展Action<any>的类型。 Action需要type属性，而thunk当然没有。我如何声明这些类型，以便dispatch函数接受thunk？

Related question
Relevant PR

最佳答案

diff --git a/src/containers/AddTodo.tsx b/src/containers/AddTodo.tsx
index e49ac4a..20a93d6 100644
--- a/src/containers/AddTodo.tsx
+++ b/src/containers/AddTodo.tsx
@@ -1,10 +1,12 @@
 import * as React from 'react';
 import { connect } from 'react-redux';
-import { Dispatch } from 'redux';
+import { ThunkDispatch } from 'redux-thunk';
+import { AnyAction } from 'redux';
 import { addTodo } from '../actions';
+import { IRootState } from '../reducers/index';

 interface IAddTodoProps {
-  dispatch: Dispatch<any>;
+  dispatch: ThunkDispatch<IRootState,any,AnyAction>;
 }

 const AddTodo = ({ dispatch }: IAddTodoProps) => {

关于javascript - 如何在Redux-thunk中使用Redux 4.0 TypeScript绑定(bind)，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/50614675/