Tengo una base de datos donde tiene diferentes habitaciones y si cada habitación está reservada en un momento determinado (es verdadero si está disponible y falso cuando está reservado). Cada vez que intento consolar. registrar el valor, funciona perfectamente, pero cada vez que intento h1 o renderizarlo, me da este error en la consola:

Error no detectado: los objetos no son válidos como hijos de React (encontrado: [promesa de objeto]). Si tenía la intención de representar una colección de niños, use una matriz en su lugar.

Aquí está el código donde intento representar el valor:

 fetch('http://localhost:7000/Rooms') .then(res => res.json()) .then( (result) => { console.log(result[0].name) result.map((room) => ( <div className="bookListing"> {console.log(room.Nine.toString())} <p>Booked for: {room.Nine.toString()}</p> </div> )) } )`

Aquí está el código de la base de datos json:

 "Rooms": [ { "Nine": true, "Ten": false, "Eleven": false, "Twelve": false, "One": false, "Two": false, "Three": true, "id": "room1", "name": "K102A" }, { "Nine": true, "Ten": false, "Eleven": true, "Twelve": true, "One": true, "Two": true, "Three": true, "id": "room2", "name": "K102B" }, { "Nine": true, "Ten": true, "Eleven": true, "Twelve": false, "One": true, "Two": true, "Three": true, "id": "room3", "name": "K101A" }, { "Nine": true, "Ten": true, "Eleven": true, "Twelve": true, "One": false, "Two": true, "Three": true, "id": "room4", "name": "K101B" }, { "Nine": false, "Ten": false, "Eleven": false, "Twelve": false, "One": false, "Two": false, "Three": false, "id": "room5", "name": "K101C" }

]

Hecho en React JSx