Typescript中的Redux验证中间件

问题描述

我希望实现redux-thunk以便在我分派可能会更改该有效状态的特定操作时处理某些表单验证。

我已经这样实现了我的actionCreator:

import { dispatchTypes,ActionTypes } from "./Actions";
import { State } from "./State";
import { Validation } from "../models/Validation";

export const runFiltersValidation = () => (dispatch: dispatchTypes,getState: ()=> State) => {
    const { searchText,rating } = getState()?.filters

    const validation: Validation = {
        isTextValid: searchText ? true: false,isratingValid: rating ? true : false
    }

    dispatch({ type: ActionTypes.SetValid,value: validation })
}

我的中间件:

import { ActionTypes,Actions,dispatchTypes } from "./Actions";
import { Middleware,dispatch,MiddlewareAPI } from "redux";
import { runFiltersValidation } from "./ActionCreators";
import { State } from "./State";

const typesRequiringValidation = [
    ActionTypes.ResetFilters
];

const actionTypeContains = (types: ActionTypes[],type: ActionTypes): boolean =>
  types.indexOf(type) !== -1;

const ValidationMiddleware: Middleware = (
  api: MiddlewareAPI<dispatchTypes,State>
) => (next: dispatch<Actions>) => <A extends Actions>(action: A) => {
  const result = next(action);

  if (actionTypeContains(typesRequiringValidation,action.type)) {
    api.dispatch(runFiltersValidation());
  }

  return result;
};

export default ValidationMiddleware;

尝试从中间件中调用过滤器动作创建者时遇到类型错误。我不知道我是否正在使用其他版本的thunk。

Error from console

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)