无法使用 react-redux 更新购物车中产品的数量

Question

我正在制作一个小型购物车，您可以在其中添加产品，每个产品都是这种格式：

  {
    id:  1,
    img: "",
    title: "",
    desc: "",
    category: "",
    price: 12,
    quantity: 0,
  }

id、price 和 quantity 是整数。在我的购物车中，我只定义了 2 个操作，您可以将其添加或删除到购物车。

如果商品已经存在，您必须增加数量，计算总价和购物车中的商品总数。

我正在为此使用 react-redux。

我的减速器是这样的：

case ADD_PRODUCT_TO_CART:
  const productInCart = state.products.find(
    (p) => p.id === action.product.id
  );
  if (!productInCart)
    return {
      ...state,
      products: [...state.products, action.product],
    };
  updateQuantity(productInCart);
  return {
    ...state,
    products: [...state.products],
  };

ADD_PRODUCT_TO_CART 必须将新商品添加到购物车，如果它不在购物车中，如果在购物车中，则更新其数量。

这就是我要确保增加对象数量的方式，（以后也可以减少）

const updateQuantity = (product) => {
  console.log("product quantity", product.quantity);
  return product.quantity === 0
    ? { ...product, quantity: 1 }
    : { ...product, quantity: product.quantity + 1 };
};

在我的产品组件中，单击添加按钮后我有添加操作：

onClick={() => props.addProduct(item)}

还有：

const mapStateToProps = (state) => {
  return {
    products: state.products,
  };
};

const mapDispatchToProps = (dispatch) => {
  return {
    addProduct: (product) => dispatch(addProductToCart(product)),
  };
};

export default connect(mapStateToProps, mapDispatchToProps)(Product);

我可以将新商品添加到购物车，但是当我再次按下添加商品时，数量并没有增加，当我控制台记录当前对象时，数量为 0。

updateQuantity returns 一个应该增加数量的产品对象，但目前没有这样做。

我运行不知道我该如何解决这个问题？

早些时候我有另一个问题，我删除了。

Answer 1

您的 updateQuantity 功能从未达到，因为您在它之前 return-ing。运行你之前的功能 return。您可能还想将结果设置为 var.

  if (!productInCart){
    const updatedProduct = updateQuantity(productInCart);
    return {
      ...state,
      products: [...state.products, updatedProduct],
    };
  }

无法使用 react-redux 更新购物车中产品的数量

cant update quantity of a product in a shopping cart using react-redux

reactjs

redux

react-redux