Redux TS通用类型'Dispatch <s>'需要1个类型参数

时间:2018-08-02 14:00:37

标签: reactjs typescript redux

尝试使用打字稿和redux设置项目。 我收到此错误

Generic type 'Dispatch<S>' requires 1 type argument(s).

这是我的store.ts

import { connectRouter, routerMiddleware } from 'connected-react-router'
import { applyMiddleware, compose, createStore } from 'redux'
import { createLogger } from 'redux-logger'
import ReduxThunk from 'redux-thunk'

import { createBrowserHistory } from 'history'

import reducers from './reducers'

import { composeWithDevTools } from 'redux-devtools-extension'

export const history = createBrowserHistory()

const composeEnhancers = composeWithDevTools({
  // Specify name here, actionsBlacklist, actionsCreators and other options if needed
})

const logger = createLogger()

const middleware = [ReduxThunk, logger]

const Store = createStore(connectRouter(history)(reducers), {}, composeEnhancers(applyMiddleware(...middleware, routerMiddleware(history))))

export default Store

这是根减少剂

import { combineReducers } from 'redux'
import { ActionType } from 'typesafe-actions'

import * as actions from '../actions'

export interface IState {
   test: string
}

export type Actions = ActionType<typeof actions>

export default combineReducers<IState, Actions>({
  test: () => 'hey'
})

这是一些虚拟动作

import { action } from 'typesafe-actions'

export const toggle = (id: string) => action('TOGGLE', id)
// (id: string) => { type: 'todos/TOGGLE'; payload: string; }

最后是index.ts

import * as React from 'react'
import * as ReactDOM from 'react-dom'
import App from './App'
import './index.scss'
import registerServiceWorker from './registerServiceWorker'

import store, { history } from './store'

import { Provider } from 'react-redux'
import { Route, Switch } from 'react-router' // react-router v4
import { ConnectedRouter } from 'connected-react-router'

ReactDOM.render(
  <Provider store={store}>
    <ConnectedRouter history={history}> { /* place ConnectedRouter under Provider */}
      <div> { /* your usual react-router v4 routing */}
        <Switch>
          <Route exact path="/" render={() => (<div>Match</div>)} />
          <Route render={() => (<div>Miss</div>)} />
        </Switch>
      </div>
    </ConnectedRouter>
  </Provider>,
  document.getElementById('root') as HTMLElement
)
registerServiceWorker()

这里似乎是一个类似的问题,但尚未解决 https://github.com/DefinitelyTyped/DefinitelyTyped/issues/9611

但是我是打字机的新手,所以可能会缺少一些基本的内容

2 个答案:

答案 0 :(得分:1)

在我看来,您确实确实面临着所链接的同一问题。在我们等待7mllm7的pull请求是否被合并时,您可以使用他的react-redux类型的修改版本。我建议采用以下方法:

  1. git clone --depth=1 https://github.com/7mllm7/DefinitelyTyped
  2. types/react-redux文件夹复制到您的项目中(例如,假设您将其复制到名为react-redux.fixed的文件夹中)。
  3. 编辑react-redux.fixed/package.json,将"private": "true"替换为"name": "@types/react-redux"
  4. 在您的package.json中,将@types/react-redux的版本指定为./react-redux.fixed
  5. 运行npm install。 npm将从node_modules/@types/react-reduxreact-redux.fixed建立符号链接。

与仅在node_modules/@types/react-redux中编辑文件相比,npm通过这种方式知道您正在使用该程序包的修改版本,并且不会覆盖该文件。 (这个过程应该广为人知;如果有时间,我会找到一个更好的地方来记录它。)

答案 1 :(得分:0)

我通过降级为Redux 3.7解决了这一问题。它具有正确的类型(Redux 4.0仍然没有类型)。他们讨论了一些Github问题(herehere)。