Javascript 分派操作时的流类型错误

我在减少流式输入错误方面取得了一些进展，但仍停留在其中一组错误上。以下是我的操作文件中的一些示例代码：

export const ADD_ERROR: 'ADD_ERROR' = 'ADD_ERROR';
export const CLEAR_ERRORS: 'CLEAR_ERRORS' = 'CLEAR_ERRORS';
export const TOGGLE_PROCESSING: 'TOGGLE_PROCESSING' = 'TOGGLE_PROCESSING';
export const RESET_STATE: 'RESET_STATE' = 'RESET_STATE';
export const CLEANUP_INPUT_COMPANY_INFO: 'CLEANUP_INPUT_COMPANY_INFO' = 'CLEANUP_INPUT_COMPANY_INFO';

type AddErrorAction = {type: typeof ADD_ERROR, payload: ValidationError};
type ClearErrorsAction = {type: typeof CLEAR_ERRORS};
type ToggleProcessingAction = {type: typeof TOGGLE_PROCESSING};
type ResetStateAction = {type: typeof RESET_STATE, userRole: Role | ''};
type CleanupInputCompanyInfoAction = {type: typeof CLEANUP_INPUT_COMPANY_INFO};

export type CustomerAction = 
     | AddErrorAction
     | ClearErrorsAction
     | ToggleProcessingAction
     | ResetStateAction
     | CleanupInputCompanyInfoAction;

以下是附带的减速器文件（为清晰起见，进行了删节）：

上述任何代码^^中均未出现错误

关联上下文中有此代码，它是根据此处概述的方法构建的：

我在这些

dispatch

语句中遇到了很多错误。每个错误的措辞略有不同，但模式相同。以下是两个例子：

无法调用对象文本绑定到动作的分派，因为： 字符串文字

切换\u处理
[1]与
属性
类型
中的字符串文字
重置\u状态
[2]。或字符串
文字
切换\u处理
[1]与字符串文字不兼容
CLEANUP\u在属性
type
中输入公司信息
[3]

无法调用对象文本绑定到动作的分派，因为：
字符串文字
CLEAR\u ERRORS
[1]与字符串不兼容
属性
类型
中的文字
重置\u状态
[2]。或字符串文字
CLEAR\u ERRORS
[1]与字符串文字不兼容
CLEANUP\u在属性
type
中输入公司信息
[3]

我不明白如何处理这些错误消息。任何建议都将不胜感激
 我最好的猜测是：
-将类型为
UPDATE\u WIZARD\u INDEX
的操作添加到
CustomerAction
-使动作注释精确。例如，代替

type AddErrorAction={type:typeof ADD_ERROR，payload:ValidationError}

试一试

typeaddErrorAction={| type:typeof ADD_ERROR，payload:ValidationError}
对于所有操作
能否提供
调度
的类型？指向的链接将有助于lot@AlexSavin，感谢[一如既往]您的大力帮助！有太多的代码，把它放到flow.org/try中是非常有挑战性的，但我也编辑了我的文章来展示上下文中的内容。工作原理：流程不理解
开关。。。减速机中的case
语句。你觉得呢？对不起，如果很难复制，那就很难帮助了。我无法在沙箱中重现这个问题。我甚至无法在评论中向您发送指向工作沙箱的链接，因为评论的长度有限。如果你能在你的问题中提供一个指向沙盒的链接，那就太好了。您仍然需要减少问题以查看问题的根源。管道字符（
|
）在
键入之前和
ValidationError}
之后有什么作用？发现：注意：您将第二个管道字符放错了位置。我有一段时间没有重新讨论这个问题了。问题是，我已经将我的一些操作移动到一个“公共”文件中，即包含多个reducer共享的操作。这会导致流出现问题，所以现在Actions文件和Reducers文件之间存在1对1的关系，所有与此相关的错误都消失了。
import { ADD_ERROR,
         CLEAR_ERRORS,
         TOGGLE_PROCESSING
         RESET_STATE,
         CLEANUP_INPUT_COMPANY_INFO } from '../actions/Customer';

export const customerReducer = (state: CustomerState, action: CustomerAction) => {
  switch (action.type) {
    case ADD_ERROR: {
      return {
        // Code here
      };
    }

    case CLEAR_ERRORS: {
      return {
        // Code here
      };
    }

    case TOGGLE_PROCESSING: {
      return {
        // Code here
      };
    }

    case UPDATE_WIZARD_INDEX: {
      return {
        // Code here
      };
    }

    case RESET_STATE: {
      return {
        // Code here
      };
    }

    case CLEANUP_INPUT_COMPANY_INFO: {
      return {
        // Code here
      };
    }

    default: {
      return state;
    }
  }
}


import React, { createContext, useReducer, useContext } from 'react';

import { customerReducer } from './reducers/Customer';
import type { CustomerAction } from './actions/Customer';
import type { UndefinedType } from '../redux/FlowTypes';
import type { ValidationError, User } from './SharedTypes';
import type { Role } from '../utils/constants';

type Dispatch = (action: CustomerAction) => void;

type CustomerState = {
  isProcessing: boolean,
  wizardIndex: number,
  validationErrors: (?ValidationError)[],
  companyName: string
};

const defaultState: FleetCustomerState = {
  isProcessing: false,
  wizardIndex: 0,
  validationErrors: [],
  companyName: ''
};

const CustomerStateContext = createContext<CustomerState>(defaultState);
const CustomerDispatchContext = createContext<Dispatch | UndefinedType>(undefined);

const CustomerProvider = ({ children }: {children: Object}) => {
  const [state: CustomerState, dispatch: Dispatch] = useReducer(customerReducer, defaultState);
  return (
    <CustomerDispatchContext.Provider value={dispatch}>
      <CustomerStateContext.Provider value={state}>
        {children}
      </CustomerStateContext.Provider>
    </CustomerDispatchContext.Provider>
  )
}

const useCustomerState = () => {
  const context = useContext(CustomerStateContext);
  if (context === undefined) {
    throw new Error('useCustomerState must be used within a CustomerProvider');
  }

  return context;
}

const useCustomerDispatch = () => {
  const context = useContext(CustomerDispatchContext);
  if (context === undefined) {
    throw new Error('useCustomerDispatch must be used within a CustomerProvider');
  }

  return context;
}

export type {CustomerState};
export {CustomerProvider, useCustomerState, useCustomerDispatch};

dispatch({type: ADD_ERROR, payload: {name, message, id}});
dispatch({type: ADD_ERROR, payload: {name, message}});
dispatch({type: TOGGLE_PROCESSING});
dispatch({type: CLEAR_ERRORS});