Question

我在使用Typescript在Redux的reducer函数中尝试将正确的类型传递给我的action属性时遇到了一些困难。在常规的es6语法中，我会传递一个类似的类型：

action: {}

但是在Typescript中代表一种更具体的动作类型，所以我尝试过这样的事情：

import {
  UPDATE_STATE,
} from '../constants/ActionTypes';

import * as Actions from '../actions/index.js';

const initialState = {
  someState: '',
}

// TODO: Type checking here is throwing an error

export default function counter(state = initialState, action : Actions ) {
  switch(action.type) {
    case UPDATE_STATE:
      return {
        ...state,
      }
    }
}

当我尝试在Webpack中编译时，Typescript当前抛出了这个错误：

[at-loader]中的错误./src/reducers/numberpad.tsx:27:64 TS2304：找不到名称'Actions'。

操作：

index.js
import * as types from '../constants/ActionTypes'

export function update(val) {
  return { type: types.UPDATE, val }
}

常量：

export const UPDATE = 'UPDATE'

到目前为止，我很茫然，我也试过传入一个类型作为“对象”（因为从我的动作返回的是一个实际的对象）但是，这似乎也没有得到认可。我也试过指定一种“any”来让它更灵活，但TS似乎也不喜欢它。

在这些情况下，我对TS检查的内容感到有点困惑。任何想法都会受到欢迎。谢谢。

Answer 1

您的操作应该是界面或类型。

您的导入是从index.js文件导入所有内容并将其命名为＆＃34;操作＆＃34;。

在index.js文件中，您需要声明一个类型或接口，例如

export interface IAction {
    type: string;
    data: any;
}

然后在你的减速机中，你需要：

import {IAction} from '../actions/index.js';

...然后你的减速机：

export default function counter(state = initialState, action : IAction) {
  switch(action.type) {
    case UPDATE_STATE:
      return {
        ...state,
      }
    }
}

正确传递类型到Redux减速器

1 个答案: