Получение предупреждающих сообщений Flow с помощью Reducer - PullRequest
Новая
       37

Получение предупреждающих сообщений Flow с помощью Reducer

0 голосов
/ 30 сентября 2019

Используя React Context API, я построил этот редуктор: 

export const usersReducer = (state: UsersState, action: UsersAction) => {
  switch (action.type) {
    case TOGGLE_MODAL: {
      return {
        ...state,
        isModalOpen: !state.isModalOpen
      };
    }

    case CANCEL_REQUEST: {
      return {
        ...state,
        isCancelRequest: action.payload
      };
    }

    case UPDATE_COMPANY: {
      return {
        ...state,
        companyId: action.payload
      };
    }

    default: {
      return state;
    }
  }
}

Связанные действия выглядят следующим образом: 

// Note: `ActionType` = `string`
export const TOGGLE_MODAL: ActionType = 'TOGGLE_MODAL';
export const CANCEL_REQUEST: ActionType = 'CANCEL_REQUEST';
export const UPDATE_COMPANY: ActionType = 'UPDATE_COMPANY';

type ToggleModalAction = {type: typeof TOGGLE_MODAL};
type CancelRequestAction = {type: typeof CANCEL_REQUEST, payload: boolean};
type UpdateCompanyAction = {type: typeof UPDATE_COMPANY, payload: number};

export type UsersAction = 
     | ToggleModalAction
     | CancelRequestAction
     | UpdateCompanyAction;

В двух экземплярах action.payload, Flowговорит следующее: 

Cannot get `action.payload` because property `payload` is missing in  `ToggleModalAction`

Я думал, что, как я определил свои 3 типа "... Действие", я мог бы включить payload там, где это оправдано, и исключить его там, где он не нужен, как в ToggleModalAction.

Есть идеи, как это решить?

1 Ответ

0 голосов
/ 30 сентября 2019

При выполнении typeof TOGGLE_MODAL и т. Д. Клавиша type вашего типа UsersAction всегда будет string. Чтобы получить справку по типу от непересекающихся объединений Flow , вам нужны сами строковые литералы: 

type ToggleModalAction = {type: 'TOGGLE_MODAL'};
type CancelRequestAction = {type: 'CANCEL_REQUEST', payload: boolean};
type UpdateCompanyAction = {type: 'UPDATE_COMPANY', payload: number};
...