Estoy tratando de almacenar productos en el almacenamiento local, pero cuando se agrega un nuevo producto, el anterior desaparece. aunque estoy pasando una matriz en el almacenamiento local. cuando vuelvo a hacer clic en el mismo producto, se actualiza la matriz, pero cuando se agrega un nuevo producto, el anterior desaparece.

aquí el código de cardInsideView:

 export default function CardInsideView() { const [CartItems, setCartItems] = useState([]) const location = useLocation() const AddItemsIntoCart =()=>{ console.log("working") setCartItems([...CartItems,location.state]) } useEffect(()=>{ if(CartItems.length){ localStorage.setItem("items",JSON.stringify(CartItems)) } },[CartItems])

Tengo 3 pantallas, la pantalla de inicio en la que se muestran las tarjetas, la pantalla de vista interior de la tarjeta que obtiene datos de la ubicación de uso y la pantalla del carrito que muestra el producto almacenado en el almacenamiento local.

aquí está el código de CartScreen

 const getDataFromLocalStorage =()=>{ const data = localStorage.getItem("items") if(data){ return JSON.parse(data) }else{ return [] } } let data = getDataFromLocalStorage()

recuerde las actualizaciones de la matriz de almacenamiento local al hacer clic en el mismo producto, pero no cuando agreguemos un nuevo producto. cuando se hace clic en el mismo producto

cuando agrego otro nuevo producto