通过条件更改对象的两个或多个值

Question

我有一个带有元素的 table，其中对于每个元素，我都有一个初始计数器 1 和两个按钮，一个增加 1，另一个减少 1，以相同的方式每个元素我都有一个价格，每个元素都是一个包含数量、价格等的对象。我正在使用 redux 并通过 +1 上的增加按钮发送到 reducer，我在其中将计数器的值加 1，这工作正常，我已经设法更改数量，即乘以价格按数量，现在当数量为2时，价格是一样的，当将数量更改为3时，它已经向我显示价格但仅针对2个产品，因为数量为4，它向我显示价格共 3 个产品。我怎样才能解决这个问题？向产品对象添加两个价格，变化的价格和不变的单一价格，以便将其乘以数量。

使用此代码，它会增加数量并将价格乘以数量，但只有当数量为 3，即 2，它才会保持相同的价格

case types.increase:{
            return {
                ...state,
                productsCart: state.productsCart.map(product =>  product.id === action.payload ? { ...product, cantidad: product.cantidad + 1, price: product.cantidad * product.precioUnidad}  : product ),
            }
    }

这是我显示所有元素并使用每个产品的数据添加到购物车的组件：

const Product = ({name, brand, price, image, id}) => {
    const dispatch = useDispatch()

    const handleAddCart = () => {
        dispatch(addProductsCart({price,image, name, id, precioUnidad: price ,cantidad: 1}))
    }
  return (
    
        <div className="product__content__card">
            <div className="card__image">
                <img 
                    src={image}
                />
            </div>

            <div className="card__body">
                <p className="name">{name}</p>
                <p className="brand">{brand}</p>
                <p className="price">${price}</p>

                <button
                    onClick={handleAddCart}
                >Add to cart</button>
            </div>
        </div>
  )
}

Answer 1

实际情况是，您是根据产品中的候选产品而不是更新后的产品来计算价格的。

当您计算价格时：

price: product.cantidad * product.precioUnidad

你应该在什么时候做：

price: (product.cantidad + 1) * product.precioUnidad

希望对您有所帮助！

通过条件更改对象的两个或多个值

change two or more values of an object by a condition

reactjs

redux