Как добавить такой же товар в корзину, но только увеличить количество - PullRequest
0 голосов
/ 05 августа 2020

Я пытаюсь добавить тот же товар в корзину и пытаюсь только увеличить количество, но всякий раз, когда я добавляю товар в корзину, он будет показывать 2 одинаковых товара.

Вот мой редуктор:

import {
    ADD_PRODUCT_BASKET,
    GET_NUMBERS_BASKET,
    LOADING,
    SUCCESS
} from '../actions/type';

const initialState = {
    products: [],
    loading: false,
    basketNumbers: 0,
    cartCost: 0,
    numbers: 0,
    inCart: false
};

export default (state = initialState, action) => {
    switch (action.type) {
        case LOADING:
            return {
                ...state,
                products: [],
                    loading: true,
                    err: ''
            };

        case SUCCESS:
            return {
                ...state,
                products: action.payload,
                    loading: false,
                    err: ''
            };
        case ADD_PRODUCT_BASKET:
            let numbers = (state.numbers += 1);
            let inCart = (state.inCart = true);
            let product = state.products;
            return {
                ...state,
                basketNumbers: state.basketNumbers + 1,
                    cartCost: state.cartCost + action.payload.price,
                    product: product.push(action.payload),
                    numbers: numbers,
                    inCart: inCart
            };
        case GET_NUMBERS_BASKET:
            return {
                ...state
            };
        default:
            return state;
    }
};

и вот моя тележка:

function Cart({ basketProps }) {
  const nf = new Intl.NumberFormat();
  let productsInCart = [];

  if (basketProps.inCart) {
    productsInCart = basketProps.products;
  } else {
    productsInCart = [];
  }

  let productQuantity = 1;

    {productsInCart.map((product, i) => (
      <ProductInfo key={i}>
        <Infor>
          <Image src={product.img_url1} />
        </Infor>
        <Infor>
          <ProductTitle>{product.title}</ProductTitle>
          <ProductPrice>
            <ProductQuantity>{productQuantity} x </ProductQuantity>
            {nf.format(product.price)} vnd
          </ProductPrice>
        </Infor>
      </ProductInfo>
    ))}
}

Как я могу повысить качество, а не добавлять новый товар в корзину?

Вот мой проект на github если вы хотите просмотреть мой код:

https://github.com/nathannewyen/the-beuter

1 Ответ

1 голос
/ 05 августа 2020

Необходимо держать счетчик каждого продукта. Теперь вы просто сохраняете push товаров в массиве.

Вместо

product: product.push(action.payload),

Вы должны сделать что-то вроде

let products = [...state.product];
let foundProduct = products.find(prod => prod.title === action.payload.title);

if (foundProduct) {
  foundProduct.quantity++;
} else {
 action.payload.quantity = 1;
 products.push(action.payload);
}

, а затем

 return {
          ...state,
          basketNumbers: state.basketNumbers + 1,
          cartCost: state.cartCost + action.payload.price,
          product: products,
          numbers: numbers,
          inCart: inCart
         };

Я не знаю, что это за другие свойства basketNumbers и numbers, но я предполагаю, что все они связаны с массивом product, поэтому их можно удалить.

...