Filter array object with an other array

Question

I want to display project that filter on skills array, for example, if I select "HTML", show me, all project with "HTML" in the project array skills. And if I select two skills, display the project that have two skills.

I have this data for my project:

const data = [
  {
    id: "1",
    name: "project1",
    techno: ["JAVASCRIPT", "REACTJS"],
    imageUrl: "link",
  },
  {
    id: "2",
    name: "project2",
    techno: ["HTML", "CSS", "SASS"],
    imageUrl: "link",
  },
  {
    id: "3",
    name: "project3",
    techno: ["JAVASCRIPT", "HTML"],
    imageUrl: "link",
  }
];

And my arrayFilter

const filter = ["JAVASCRIPT", "HTML", "CSS"];

For the moment, I have this code :

 data
  .filter((filter) => filter.techno.includes(filter[0]))
  .map(({ id, ...otherProps }) => (
     <ProjectItem key={id} {...otherProps} />
     ))

Thank you for your help

What's the issue? Your code seems to be unfinished but you are on the good path, what is the problem? — geauser
– geauser, Commented Jun 29, 2020 at 11:57

Nikita Madeev · Accepted Answer · 2020-06-29 11:58:03Z

2

You can use every

const data = [
    {
        id: '1',
        name: 'project1',
        techno: ['JAVASCRIPT', 'REACTJS'],
        imageUrl: 'link',
    },
    {
        id: '2',
        name: 'project2',
        techno: ['HTML', 'CSS', 'SASS'],
        imageUrl: 'link',
    },
    {
        id: '3',
        name: 'project3',
        techno: ['JAVASCRIPT', 'HTML', 'REACTJS'],
        imageUrl: 'link',
    },
];

const filter = ['JAVASCRIPT', 'REACTJS'];

const result = data.filter(d => filter.every(t => d.techno.includes(t)));

console.log(result);

answered Jun 29, 2020 at 11:58

Nikita Madeev

4,49012 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Filter array object with an other array

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related