Obtengo mis datos a un ritmo muy lento, así que cuando abro mi sitio web por primera vez, toma algunas veces hasta que se muestra todo el producto. Así que quiero agregar un cargador hasta que mis datos estén completamente cargados.
usé Hook personalizado para cargar datos
Una forma de hacer esto, que me gusta y es muy sencilla, es agregar declaraciones condicionales, lo que significa que si los datos pasados como accesorio no están definidos actualmente, return <div>Loading.....</div> en caso contrario devuelve el JSX que contiene los datos de utilería.
Si no hace esto, React mostrará un error. Esto se debe a que, al buscar, hay un momento en que los datos no están definidos y si React intenta hacer algo con ellos de antemano, no encuentra nada. Estas condiciones son una forma de decirle a React cuándo es un buen momento para acceder a los datos.
export default function MyComponent({someData}){ if(!someData) return <div>Loading.....</div> else{ return <div>{someData}</div> } }