Me estoy confundiendo con React aquí (novato total). Tengo un componente simple que obtiene algunos datos que siempre devuelven {"score":100} :
import React, { useEffect, useState } from "react"; import Graph from "./Graph.js"; const UsingFetch = () => { const [results, setResults] = useState({"score": null}); // initially set score to null const fetchData = () => { fetch("https://myapi.com/id=1") .then((response) => { return response.json(); }) .then((data) => { setResults(data); // update results with integer score }); }; useEffect(() => { fetchData(); }, []); console.log(results) return ( <div> <Graph results={results.score}></Graph> </div> ); }; export default UsingFetch; Mi Graph.js se parece a lo siguiente:
import { React } from 'react' export default function Graph({results}) { console.log(results) return ( <div> <h1>{results}</h1> </div> ) }¿Por qué la partitura no aparece en la página? He confirmado que los datos regresan correctamente, simplemente parece que no puedo acceder a ellos correctamente.
Aquí está la salida de la consola:
Los resultados son una matriz.
<h1>{results.map((result) => (result.score)}</h1>