Así que estoy tratando de obtener el precio de los productos en uno de mis archivos. Tengo un .map en mi archivo

 {cart.map((products) =>( <Card key={products.id} className="card-cart">{/*make it so this wraps around the whole project */} {/* {totalPrice = products.reduce((acc, currentValue) => { return acc + currentValue }, 0)} */} {/* {console.log(totalPrice)} */} {/* const totalPrice = products.reduce((acc, currentValue) => {//you have to grab the product price and use the reduce to cycle through the array return acc + currentValue }, 0) console.log(totalPrice) */} {console.log(products.price)} <Card.Body> <Card.Title>{products.name}</Card.Title> <Card.Text>{products.description}</Card.Text> <Card.Footer>{"$" + products.price}</Card.Footer> <Button className="btn btn-primary btn-add" onClick={() => incrementProduct(products.id)}>+</Button> <Button className="btn btn-primary btn-minus" onClick={() => decrimentProduct(products.id)}>-</Button> <h1 className="card-items-quantity">Items: </h1> </Card.Body> </Card>))}

y cada vez que tomo el precio de los productos en el mapa, funciona, pero siempre que me muevo fuera de él. Dice que es indefinido

 const {products, setProduct} = useContext(productContext) // console.log("your product price is " + products.price) console.log("your product price is " + products.price)```