javascript - ReactJS如何循环遍历数组并获取另一个数组中对象的特定属性

Question

因此，我有一组与特定团队相关的用户，每个用户都具有特定的权限。如果用户与多个团队相关，则所有这些团队也可以在数组中使用:

[
{
    "name" : "user1",
    "teams": [
        {"id": "123", "name": "team-1", "permissions" : 1}
    ]
},
{
    "name" : "user2",
    "teams": [
        {"id": "123", "name": "team-1", "permissions" : 3}
    ]
},
{
    "name" : "user3",
    "teams": [
        {"id": "456", "name": "team-2", "permissions" : 3},
        {"id": "789", "name": "team-3", "permissions" : 3},
        {"id": "123", "name": "team-1", "permissions" : 3},
        {"id": "233", "name": "team-4", "permissions" : 3}

    ]
}

]

所以现在我想要这个:

我获取了当前正在查看的团队的ID(ID:123)，如何映射数组，以便只能显示ID:123的团队的权限？

我执行了以下操作，但这不起作用，因为 User3 的第一个项目是错误的团队。

 const MembersTable = observer(({ state }) => (
   <div>
     <table className="table table-hover table-responsive">
      <thead>
       <tr>
         <th>Name</th>
         <th>Email</th>
         <th>Permissions</th>
       </tr>
     </thead>
     <tbody>
      {state.accounts.map((account, i) => <MembersTableData state={state} account={account} team={account.teams} key={i}/>)}
     </tbody>
    </table>
 </div>
))

const MembersTableData = observer(({ state, account, organization }) => (
  <tr>
    <td>
      <span>{account.fullName}</span>
   </td>
    <td>{account.email}</td>
    <td>
     {team[0].permissions == 1 && <span>member</span>}
     {team[0].permissions == 2 && <span>administrator</span>}
     {team[0].permissions == 3 && <span>super admin</span>}
    </td>
  </tr>
 ))

this.state.team 在本例中为“123”。

我该如何解决这个问题？

Answer 1

team[0]将始终拥有用户所属的第一个团队。您想要的是拥有 id 的团队等于 this.state.team 的属性。因此，而不是 team[0]尝试这样做:

{team.find(t => t.id == this.state.team).permissions == 3 && <span>super admin</span>}

当然这也适用于“member”和“admin”。