简体   繁体   中英

reactjs how to filter / check if a any object in an array is present in another array of objects?

im facing the issue when trying to implement some conditional rendering. Here is the context:

the data:

groups_a : [
             {id:1} ,
             {id:2}
            ]

groups_b : [
             {id:1} ,
             {id:3}
            ]

The condition:

I wish to be check each item in groups_b, whether they exist in groups_a. So in this case, the condition should return back true because groups_b has id:1 and so does groups_a

JSX:

            {###the condition ##
                         ?
            <Button>Approve</Button>   
            :
            null
            } 

You could do this assuming groupA/groupB to be array of object

 const groupA = [{id:1}, {id:3}, {id:4}]; const groupB = [{id:1}, {id:3}]; const boolean = groupB.every(obj => groupA.find(aObj => obj.id === aObj.id)); console.log('Method 1:', boolean) // this will be true if every object in B is included in A // If these are extremely large arrays you can improve performance by converting groupA into obj, and then checking by that object const groupAHashMap = groupA.reduce((acc, cur) => ({...acc, [cur.id]: true}), {}); const boolean2 = groupB.every(obj => groupAHashMap[obj.id]); console.log('Method 2:', boolean2)

checkout this

function App(){ 

    const groupA = [{id:1}, {id:2}];
    const groupB = [{id:1}, {id:3}];

    const gourpAIds = groupA.map(item => item.id);

    return groupB.map(item => {
        if(gourpAIds.includes(item.id)){
            return <Button>Approve</Button>   ;
        }else{
            return null;
        }
    });

}

it's an other solution that you can get the common list also.

 const groupA = [{id:1}, {id:3}, {id:4}]; const groupB = [{id:1}, {id:2}]; const ListCommon = groupA.filter(x => groupB.find(y => x.id === y.id)); console.log('result:', ListCommon.length>0) console.log('List:', ListCommon)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM