React:根据客户id呈现用户

Question

我有这个问题。我想根据客户id呈现分配的用户的用户名。

技术上可以工作，但不按我想要的方式工作。

这是分配的users对象:

"assigneduser": [
{
"user_id": 1,
"customers_id": [
2
],
"username": "testuser"
},
{
"user_id": 2,
"customers_id": [
3,
4
],
"username": "filanfisteku"
}
]

我正在根据customers_id:

过滤分配的用户

let assigneduserfilter = Object.values(assigneduser).filter(
({ customers_id }) => customers_id == i.id // i is the customers map
);

然后映射assignduserfilter:

{assigneduserfilter.map((z) => (
<td key={z.customers_id}>{z.username}</td>                    
))}

如何在相关的客户表行上呈现分配的用户username ?

Answer 1

这很简单，假设您有一个对象数组，如下所示

const arr = {
assigneduser: [
{
user_id: 1,
customers_id: [2],
username: "testuser",
},
{
user_id: 2,
customers_id: [3, 4],
username: "filanfisteku",
},
],
};

您可以创建一个函数来查找客户，如下所示。

const assgnedUserFilter = (user) => {
return arr.assigneduser.find((u) => u.customers_id == user);
};

然后使用您想要查找的customer_id调用该函数。然后手动将这些值映射到HTML中。

const selectedCustomer = assgnedUserFilter(2);
<p id="customer_id">{selectedCustomer.customer_id}</p>
<p id="username">{selectedCustomer.username}</p>