Estoy haciendo un comercio electrónico con React JS y uso Firebase como emulador de backend. He creado correctamente un pedido que almacena los valores deseados y el documento se almacena correctamente en Firebase: el documento simula el pedido que corresponde a lo que compró el cliente. Quiero crear un cuadro modal que le dé al comprador su ID de pedido, sin embargo, no puedo capturar esa ID y no sé cómo hacerlo, pero el registro de la consola me da la ID.
Aquí está el código para crear el documento que va a Firebase:
const saveOrder = async () => { const cartFiltered = cart.map(({ id, title, quantity }) => ({ id, title, quantity })); const orderToSave = { buyer: buyer, items: cartFiltered, total: cartTotal(), }; console.log(orderToSave); const db = getFirestore(); const ordersCollection = collection(db, "orders"); const response = await addDoc(ordersCollection, orderToSave); console.log(response.id); }Y aquí está el código para la parte del modal que da la ID:
<p> ("Your order ID is: {response.id} . Thanks for shopping!") </p>Recibo el siguiente error: "la respuesta no está definida".
Todas las llamadas a Firestore me parecen bien a primera vista, por lo que es más probable que no esté haciendo que su variable de response esté disponible para la representación de la interfaz de usuario.
Para hacer eso, querrá almacenar la response en el estado, por ejemplo, configurándolo con un useState :
const [response, setResponse] = useState({ id: "" }); ... const res = await addDoc(ordersCollection, orderToSave) setResponse(res); console.log(res.id);