nic0q / carrito_localstorage

Implementación de un carrito de compras usando localStorage

Carrito_LocalStorage

Repositorio de un carrito de compras usando localStorage

• Estas funciones fueron usadas en React

Instrucciones de uso

1. Colocar estas funciones en una carpeta en el proyecto por ejemplo utilities

2. Importar las funciones en el Componente que se quieran usar, por ejemplo en este componente Menu

Modo de uso en React

Nota: El carrito tiene la forma { items: [ ] } Donde items es la lista donde se añaden los items

• Crear un Hook useState (cart) donde se encuentre el carrito del tipo lista ubicado en localstorage

const [cart, setCart] = useState(localStorage.getItem("cart") ? JSON.parse(localStorage.getItem("cart")) : []);

• En el mismo componente crear funciones para añadir items, donde los atributos se pasan como parametro (Puede hacerse de otra forma, pero personalmente prefiero esta)

Por ejemplo aquí se tiene un objeto pizza {name, id, img, price} que se utiliza para otro componente FoodCart, la funcion add se pasa como parametro

Componente foodcart

Y la función add crea el objeto del tipo { } con los atributos y simplemente la pasa a la función importada en utilities y además se setea el Hook Cart para tenerlo actualizado en el componente

• Lo mismo para remove item