Тип {error} отсутствует в типе <TYPE_A>, но является обязательным для типа <TYPE_B> - специфическая проблема Redux

У меня небольшая проблема с набором Redux Reducer. Я знаю, что на этот вопрос в основном ответили, но я считаю, что решений не хватает, и я бы назвал их более обходными путями, чем что-либо еще.

Эта проблема: у меня Redux Reducer. Внутри него 3 функции, управляющие состоянием дляLoading, Success а также Failure, поставляя необходимые data или errorsв состоянии по пути. И вот теперь в игру входит TS. В основном я получаю эту ошибку:

TS2418: Type of computed property's value is
'(state: ImmutableObjectMixin<IState>, { error }: ActionFailure<Type.LIST_ITEMS_FAILURE, HttpError>) => ImmutableObjectMixin<...>',
which is not assignable to type '(state: ImmutableObjectMixin<IState>, action: ActionWithPayload<Type.LIST_ITEMS_SUCCESS, IItems[]>, { error }: ActionFailure<Type.LIST_ITEMS_FAILURE, HttpError>) => ImmutableObjectMixin<...>'.

Types of parameters '__1' and 'action' are incompatible.
Property 'error' is missing in type 'ActionWithPayload<Type.ITEMS_SUCCESS, IItems[]>' but required in type 'ActionFailure<Type.LIST_ITEMS_FAILURE, HttpError>'.

Ошибка появляется в следующем блоке:

const ACTION_HANDLERS: {
  [key: string]: (
    state: ImmutableObjectMixin<IState>,
    action: ActionWithPayload<Type.LIST_ITEMS_SUCCESS, IItems[]>,
    { error }: ActionFailure<Type.LIST_ITEMS_FAILURE, HttpError>
  ) => ImmutableObjectMixin<IState>;
} = {
  [Type.LIST_ITEMS_ATTEMPT]: onListFetching,
  [Type.LIST_ITEMS_SUCCESS]: onListFetchingSuccess,
  [Type.LIST_ITEMS_FAILURE]: onListFetchingFailure // This line throws the TS Error
};

Теперь я прочитал о предоставлении error, для всех возможных свойств или сделать их все необязательными в соответствующих ответах, но на самом деле они не решают мою проблему.

Вот функции:

const onListFetching = (state: ImmutableObjectMixin<IState>): ImmutableObjectMixin<IState> =>
  state.merge({
    listFetching: true,
    list: [],
    errorListing: null
  });

const onListFetchingSuccess = (
  state: ImmutableObjectMixin<IState>,
  action: ActionWithPayload<Type.LIST_ITEMS_SUCCESS, IItems[]>
): ImmutableObjectMixin<IState> => {
  const { payload = [] } = action;
  return state.merge({
    listFetching: false,
    list: payload,
    errorListing: null
  });
};

const onListFetchingFailure = (
  state: ImmutableObjectMixin<IState>,
  { error }: ActionFailure<Type.LIST_ITEMS_FAILURE, HttpError>
): ImmutableObjectMixin<IState> =>
  state.merge({
    listFetching: false,
    errorListing: error,
    list: []
  });

Любая помощь при вводе этого текста будет оценена. Думаю, проблема в ключевом свойстве. Поскольку мы реструктурируемerrorно я мог ошибаться. Спасибо вам..

1 ответ

Вместо того, чтобы набирать его самостоятельно, я использовал интерфейс Handlers Generic из redux-sauce.

Вот сам интерфейс:

  export interface Handlers<S> {
    [type: string]: (state: S, action: Action) => S;
  }

По сути, он делает то же самое, что и мой набор текста, но перекрывает ошибку TS. Хотя не знаю почему. Было бы полезно узнать, если у вас есть ответ.

Вот новый код:

const ACTION_HANDLERS:Handlers<ImmutableObjectMixin<IState>> = {
  [Type.LIST_ITEMS_ATTEMPT]: onListFetching,
  [Type.LIST_ITEMS_SUCCESS]: onListFetchingSuccess,
  [Type.LIST_ITEMS_FAILURE]: onListFetchingFailure
};

Все работает как чар,. Но если его можно улучшить еще больше, дайте мне знать..

Другие вопросы по тегам