我有兩個包含成員資訊的物件陣列。每個物件都被映射出來以在螢屏上顯示用戶資訊。每個顯示的用戶旁邊都會有一個復選框。單擊復選框時,用戶可以從資料庫中洗掉選定的用戶
問題:單擊 userObj 復選框時,該 userObj 將添加到名為 checkedIds 的陣列中。我不知何故需要將原始的 teamMembers 陣列與新的 checkIds 陣列進行比較。并回傳一個包含所有 ID 的陣列,除了 checkIds中的 ID
注意* 比較基于 ID 屬性。注意*我需要最終的 ID 陣列,因為這是后端的預期
userObj -> {ID: userID, Name:userName, Email:userEmail}
checkedIds -> array of [userObjs] with a checked checkbox status
(this means all objects in this array have been marked for deletion.)
teamMembers -> an array of [userObjs] of all teamMembers currently in the database
// Process flow
teamMembers array ->
[{ID: 45, Name:userName1, Email:userEmail1},
{ID: 78 Name:userName2, Email:userEmail2},
{ID: 2, Name:userName3, Email:userEmail3}
]
// These items are mapped in the react JSX to display the name and email on screen.
// And each mapped object will also display a checkbox
user clicks checkbox ->
// when a user clicks a checkbox to mark that userObj for deletion,
the actual object is copied to a new array called checkedIds
// now we have 2 array of objects checkedIds and teamMembers
Delete button is clicked
***// This is where I'm stuck***
// after the user checks the checkbox, and then presses the delete button,
I need to compare the two arrays. and return a new array that contains
only the ID's of the remaining objects, that is to say, all objects in
teamMembers that do not share the same ID as any of the objects in checkedIds
預期輸出:
teamMembers =
[
{ID: 45, Name:userName1, Email:userEmail1},
{ID: 78 Name:userName2, Email:userEmail2},
{ID: 2, Name:userName3, Email:userEmail3}
]
checkedIds =
[
{ID: 45, Name:userName1, Email:userEmail1},
]
RETURNS ->
fitlteredArr =
[78,2]
uj5u.com熱心網友回復:
內容如下:
teamMembers.filter(({ ID }) => !checkedIds.map(x => x.ID).includes(ID))

轉載請註明出處,本文鏈接:https://www.uj5u.com/net/520851.html
上一篇:在物件中搜索值并放入新陣列
下一篇:永久更改物件
