Tengo una matriz, pero solo se está representando el primer elemento de la matriz. Cómo hacer esto. Esta es la respuesta de Firebase. En la consola está bien, pero en jsx solo se representa el primer elemento. Aquí está mi código
let users=[ { email: "rabina@gmail.com", id: "jqGZhhXDa8xI4iMtYO0U", joined_at: Fri Dec 03 2021 03:44:44 GMT+0545 (Nepal Time), name: "Rabina chandak", profile: "https://picsum.photos/200/300/?blur=2" }, { id: 'LVEy69S3VIZXdztSKTyG', name: 'Jeevan', email: 'jeevan@gmail.com', joined_at: Fri Nov 12 2021 11:33:33 GMT+0545 (Nepal Time), profile: 'https://picsum.photos/200/300/?blur=5' } ] users.map((user)=>{ console.log(user.id) }) const User=()=>{ return( div className="flex"> <div className="bg-gray-100 w-full p-4 justify-between"> <div className="lg:mx-16 mx-8"> <div className="grid lg:grid-cols-5 md:grid-cols-3 sm:grid-cols-1 gap-4"> { {users.forEach((user)=>{ return <UserCard key={user.id} name={user.name} email={user.email} id={user.id} profile={user.profile} session={session}/> })} } </div> </div> </div> </div> ) }prueba este código:
<div> {users.map((user) => ( <h2>{user.name}</h2> ))} </div>en lugar de esto, funcionará perfecto:
const User = () => { return users.map(user => { return ( <p> {user.id} </p> ); }); };