기술 배열을 필터링하는 프로젝트를 표시하고 싶습니다. 예를 들어 "HTML"을 선택하면 프로젝트 배열 기술에 "HTML"이있는 모든 프로젝트를 표시합니다. 두 가지 기술을 선택하면 두 가지 기술이있는 프로젝트를 표시합니다.
내 프로젝트에 대한 데이터가 있습니다.
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",
}
];
그리고 내 arrayFilter
const filter = ["JAVASCRIPT", "HTML", "CSS"];
지금은이 코드가 있습니다.
data
.filter((filter) => filter.techno.includes(filter[0]))
.map(({ id, ...otherProps }) => (
<ProjectItem key={id} {...otherProps} />
))
도와 주셔서 감사합니다
당신은 모든 것을 사용할 수 있습니다
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);
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다