Tengo un problema con mi aplicación reaccionar y express/mongodb donde la primera carga miscData no está definida (que es el nombre de mi colección en mi base de datos mongodb), pero cuando comento todas las etiquetas de párrafo y solo console.log(getBasic) Puedo registrarlo (cuando antes no podía registrarlo debido a que no estaba definido) y luego, cuando elimino los comentarios de las etiquetas de párrafo, puedo verlos ahora, eso es hasta que actualizo, lo que restablece esto.

Tengo una declaración de console.log y luego 3 párrafos html que muestran los títulos del blog. Cuando inicio por primera vez, no funciona hasta que hago el comentario guardar, descomentar guardar, actualizar el método mencionado anteriormente.

Aquí hay un video de 1 minuto que muestra de lo que estoy hablando si eso no tiene mucho sentido.

Aplicación.js:

 function App() { const [getBasic, setGetBasic] = useState() async function fetchData() { await axios.get('http://localhost:3001/api') .then(result => setGetBasic(result.data)) } useEffect(() => { fetchData() }, []) return ( <div className="App"> <p>{JSON.stringify(getBasic.miscData[1].blogTitle)}</p> <p>{JSON.stringify(getBasic.miscData[2].blogTitle)}</p> <p>{JSON.stringify(getBasic.miscData[3].blogTitle)}</p> {console.log(`getBasic ${JSON.stringify(getBasic)}`)} </div> ); } export default App;

servidor.js:

 app.get('/api', (req, res) => { res.header('Access-Control-Allow-Origin', 'http://localhost:3000'); res.header( 'Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept' ); db.collection('miscData').find().toArray((err, result) => { if (err) return console.log(err) res.send({ miscData: result }) }) })

Así es como se ve miscData :

 getBasic {"miscData":[{"_id":"62604421b57b621bda4171c7","blogTitle":"Different title","blogBody":"lorem ipsum etc etc etc"},{"_id":"626058bb61967575695bdade","blogTitle":"Com squadron","blogBody":"asidjaoisdoasodjiaosjdoia"},{"_id":"626059f961967575695bdadf","blogTitle":"test","blogBody":"test"},{"_id":"62605a3d36e02b8581f56154","blogTitle":"asdasda","blogBody":"adadada"},{"_id":"62608bc60bd6de526fd1b0bc","blogTitle":"new title","blogBody":"new body"}]}

Mi React es el puerto 3000 y el servidor es 3001