只有第一个数组元素在反应 js 中呈现

Question

我有一个数组，但只有第一个数组元素正在渲染。如何执行此操作。这是 Firebase 的回应。在控制台中它很好，但在 jsx 中只有第一个元素正在渲染。 这是我的代码

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>
     )
    }

Answer 1

试试这个代码：

               <div>
                {users.map((user) => (
                  <h2>{user.name}</h2>
                ))}
              </div>

而不是这个，它会完美地工作：

 const User = () => {
    return users.map(user => {
        return (
            <p>
                {user.id}
            </p>
        );
    });
};