Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

107
Vistas
Comportamiento extraño al mapear sobre una matriz comprimida que contiene datos asíncronos

Estoy tratando de obtener datos de firestore, luego tomar las URL de las imágenes almacenadas en el almacenamiento de firebase, luego comprimir los dos datos para poder enviarlos a la vez como accesorios a un componente. Mi problema es que cuando trato de acceder al segundo elemento de mi matriz, solo devuelve indefinido. Aquí está la sección del código en cuestión, donde tomo los datos e intento enviarlos a un componente:

 ... const [slimes, setSlimes] = useState([]); useEffect(() => { let mounted = true; const getSlimes = async () => { const snap = await getDoc(docRef); if (!snap.exists()) return; // Grab ids, map them into an array let data = snap.data().slimes.map((id) => {return [id]}); // Grab urls, zip with ids data.map(async (id) => { let fetchURL = process.env.REACT_APP_BUCKET + path + id[0] + ".png"; const url = await getDownloadURL(ref(storage, fetchURL)); id.push(url); }); if (mounted) setSlimes(data); }; getSlimes(); return () => { mounted = false; } }, []); if (!slimes.length) { return <LinearProgress />; } else { console.log(slimes); return (<> <div id="inv-header">{discordid}'s Slimes</div> <div id="cards-container"> {slimes.map((slime) => { // Bugged part console.log(slime); console.log(slime[0] + " || " + slime[1]); return (<SlimeCard key={slime[0]} slimeid={slime[0]} url={slime[1]}/>); })} </div> </>); }

Cuando estoy mapeando mi estado, puedo acceder al primer elemento de la matriz, pero el segundo solo se muestra indefinido. Cuando registro en la consola el objeto asignado singular, veo la URL y la identificación correctas. Incluso antes de mapear el objeto de estado, todavía contiene todos los datos correctos. Aquí hay una imagen de mi salida en una ejecución de ejemplo:

ingrese la descripción de la imagen aquí

Todos mis datos son correctos, esto tiene que ser un problema de semántica con javascript que no entiendo, algún problema asincrónico loco o algo realmente obvio. Este problema, al menos para mí, parece de muy bajo nivel, por lo que no he podido encontrar muchas soluciones.

Esto me ha estado molestando durante días, he pasado por 5 iteraciones importantes diferentes tratando de que estas URL se aprueben correctamente sin suerte.

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda