Почему возникает ошибка Действия должны быть простыми объектами. Используйте настраиваемое промежуточное ПО для асинхронных действий. появляется, когда нет асинхронных действий?

Я пытался понять React глубже и застрял на этой ошибке. Он не позволял мне отправлять какие-либо действия. Однако я вообще не использую async. Здесь вы можете найти codeandbox полного приложения.

Я добавил thunkMiddleware в магазин, так что приложение будет работать. Однако я не могу понять, что происходит?

Вот создатели действий, внутри которых я не отправляю облако. Я искал разные похожие ответы, и все они были связаны с неправильным использованием асинхронных действий. Мои синхронизируются:

import CART_ACTIONS from "../action_types/cartActionTypes";

function addToCart(item) {
  return dispatch => dispatch({ type: CART_ACTIONS.ADD_ITEM, item: item });
}

function removeFromCart(item) {
  return dispatch => {
    dispatch({ type: CART_ACTIONS.REMOVE_ITEM, item });
  };
}

function clearCart(item) {
  return dispatch => {
    dispatch({ type: CART_ACTIONS.CLEAR_CART });
  };
}

export const cartActions = { addToCart, removeFromCart, clearCart };

person Animus    schedule 05.12.2019    source источник
comment
Что мне делать, чтобы воспроизвести проблему в песочнице?   -  person I am L    schedule 05.12.2019
comment
Удалите applyMiddleware (thunkMiddleware). Я обновил ссылку. Вы можете открыть консоль песочницы (под видом приложения, в левом нижнем углу), там вы увидите ошибку.   -  person Animus    schedule 05.12.2019
comment
Почему вы удаляете applyMiddleware (thunkMiddleware), если она с ним работает?   -  person SuleymanSah    schedule 05.12.2019
comment
@SuleymanSah, это отличный вопрос: D. Однако я не использую никаких асинхронных вызовов и хочу знать, почему это вообще происходит?   -  person Animus    schedule 05.12.2019


Ответы (1)


Если вы не хотите использовать thunkMiddleware, вам необходимо обновить корзину.

import CART_ACTIONS from "../action_types/cartActionTypes";

function addToCart(item) {
   return({ type: CART_ACTIONS.ADD_ITEM, item: item });
}

function removeFromCart(item) {
    return({ type: CART_ACTIONS.REMOVE_ITEM, item });

}

function clearCart(item) {
    return({ type: CART_ACTIONS.CLEAR_CART });
}

export const cartActions = { addToCart, removeFromCart, clearCart };

Просто вам просто нужно вернуть действие, которое должно быть объектом со свойством типа и, возможно, полезной нагрузкой.

codeandbox

person SuleymanSah    schedule 05.12.2019
comment
Значит, мне не нужно использовать для этого отправку? Я имею в виду отправку ({type: CART_ACTIONS.CLEAR_CART}). Вы говорите, что этот объект передан в отправку? - person Animus; 05.12.2019
comment
@Animus, вам не следует использовать отправку, если у вас нет асинхронного действия. Возврат простого объекта, как я показал в ответе, является одной из основ редукции. - person SuleymanSah; 05.12.2019
comment
@Animus, пожалуйста, я был бы признателен, если бы вы проголосовали за. - person SuleymanSah; 05.12.2019