如何使用flow-typed键入Redux商店？

Question

我正在尝试使用flow-typed正确键入Redux。我使用从Store导入的redux来输入我的商店，Flow使用flow-typed文件redux_v4.x.x.js并引发了一个错误：

/* @flow */
import rootReducer from '@reducers/index'
import type { Store } from 'redux'
import { applyMiddleware, createStore } from 'redux'
import { composeWithDevTools } from 'redux-devtools-extension'
import thunk from 'redux-thunk'

const configureStore = () => {
   const store: Store = createStore(
    rootReducer,
    composeWithDevTools(applyMiddleware(thunk))
  )
  return store
}

export { configureStore as default }

使用此代码，我获得以下错误：Cannot use Store [1] without 2-3 type arguments。

我试图像const store: Store<S, A>这样定义它，但然后Flow抱怨他没有找到S和A的声明，这似乎是正常的。

在redux_v4.x.x.js使用的flow-typed文件中，Store的定义如下：

  declare export type Store<S, A, D = Dispatch<A>> = {
    // rewrite MiddlewareAPI members in order to get nicer error messages (intersections produce long messages)
    dispatch: D,
    getState(): S,
    subscribe(listener: () => void): () => void,
    replaceReducer(nextReducer: Reducer<S, A>): void,
  };

我已经看过这篇文章与我的文章非常相似但到目前为止还没有答案，所以这篇文章就像一个凹凸的typing redux store using flowtype and flow-typed。

感谢帮助！

Answer 1

你需要为S类型提供A和Store。例如，

import { createStore } from 'redux';
import type { Store } from 'redux';

type State = Array<number>;
type Action = { type: 'A' };
type MyStore = Store<State, Action>;
const store: MyStore = createStore(...);

// or inline
const store: Store<Array<number>, { type: 'A' }> = createStore(...);

查看test_createStore.js中提供的示例，或者更完整的示例，请查看this sandbox。