Реагировать - не удалось отправить избыточное действие с дополнительным аргументом - PullRequest
Новая
       3

Реагировать - не удалось отправить избыточное действие с дополнительным аргументом

1 голос
/ 19 февраля 2020

Я пытался работать с машинописью с redux-thunk и redux. Я хотел бы передать объект любому действию (я использую внедрение зависимостей, и мне нужно передать объектный сервис или строку)

я получил эту ошибку; 

  Overload 1 of 2, '(action: AnyAction): AnyAction', gave the following error.
    Argument of type '(dispatch: any, getState: AppState, extraArg: string) => Promise<any>' is not assignable to parameter of type 'AnyAction'.

это сделано как следующие:

store.ts: 

const middlewares = [
    routerMiddleware(history),
    thunkMiddleware.withExtraArgument('bar') as ThunkMiddleware<
      AppState,
      Actions,
      string
    >
  ];
  const middleWareEnhancer = applyMiddleware(...middlewares);

  const store = createStore(
    rootReducer(history),
    preloadState,
    composeWithDevTools(middleWareEnhancer)
  );

мой index.ts, куда я пытаюсь отправить действие: 

(store.dispatch as ThunkDispatch<{}, void, AnyAction>)(getAll());

мой файл действия, который работает: 

export const getall = () => async (dispatch: any) => {
  try {
    dispatch({ type: GETALL_REQUEST });
    return dispatch({ type: GETALL_SUCCESS, payload: null });
  } catch (e) {
    return dispatch({ type: GETALL_FAILURE, error: e });
  }
};

мое действие (часть его), которое вызывает ошибку 

export const getAll = () => async (
  dispatch: any,
  getState: AppState,
  extraArg: string
) => {....action logic}

тогда я получил ошибку: 

(store.dispatch as ThunkDispatch<{}, void, AnyAction>)(getAll());

1 Ответ

1 голос
/ 20 февраля 2020

Самый простой способ исправить ошибку: 

(store.dispatch as ThunkDispatch<AppState, string, AnyAction>)(getAll());

и 

export const getAll = () => async (
  dispatch: any,
  getState: () => AppState,
  extraArg: string
) => {....action logic}

  1. ThunkDispatch принимает следующие аргументы типа: S - состояние, E - расширенный аргумент, A - действие. Поэтому использование ThunkDispatch должно соответствовать типам вашего состояния и расширенному аргументу.

  2. Действие thunk - это функция, которая принимает следующие аргументы: dispatch - это функция, getState - это также функция, которая возвращает состояние и extraArg. Поэтому убедитесь, что getState - это функция.

Чтобы избежать приведения dispatch, я предлагаю при создании создать правильный магазин. Поскольку вы используете applyMiddleware, который принимает массив, вы должны передать ему аргумент типа. Он принимает тип отправки, который будет использоваться после применения делавэров. 

const middlewares = [thunk.withExtraArgument("bar")];
const middleWareEnhancer = applyMiddleware<
  ThunkDispatch<AppState, string, Actions>
>(...middlewares);

В результате вы получите магазин с правильно набранной функцией отправки. И вы сможете использовать его без приведения. 

store.dispatch(getAll());

Рабочий демо

...