Question

我在代码库中有这个

export const login = (user, pass) => {
  return (dispatch) =>    dispatch({ type: LOGIN });
}

login的返回类型是什么？

我尝试过：

export const login = (user, pass)  : ReducerAction {
  return (dispatch) =>  dispatch({ type: LOGIN });
}

，这种类型肯定是错误的。此处正确的TS返回类型是什么？在网上很难找到答案。

Answer 1

以以下方式为您的redux动作调度道具提供一个接口就足够了：

interface DispatchProps {
  login: () => void;
}

然后您可以使用上面的界面为mapDispatchToProps提供类型。

const mapDispatchToProps = (dispatch: Dispatch<DispatchProps>) =>
  bindActionCreators({
    login: () => login(),
  }, dispatch);

如果您正在使用react / redux / TypeScript，我会推荐这个guide，因为它有大量的资源。另外，您可能需要安装typesafe-actions，它是“ Redux / Flux Architecture中“操作创建者”的Typesafe实用程序”的一种形式。

Answer 2

这里的问题是Typescript不知道dispatch的类型。据Typescript知道，它可以是任何随机函数参数，并且可以具有any类型。您需要将其声明为正确的类型，然后Typescript才能推断出其余的类型：

const LOGIN = "LOGIN";

type LoginAction = {
  type: typeof LOGIN
}

const login = (user, pass) => (dispatch: React.Dispatch<LoginAction>) => dispatch({type: 'LOGIN'});

请注意，登录操作也需要具有声明的类型，因为该类型将传递给通用React.Dispatch类型，以便Typescript知道它正在分派的类型。

您可能需要安装@types/react-redux软件包才能获得React.Dispatch类型，但我不确定它来自哪里。

Redux操作的TypeScript返回类型

2 个答案: