英文:
How to check if array of values all exist within an array of objects
问题
我正在构建一个由类别和标签组合而成的过滤数据对象,并希望使用这些数据来过滤一个包含对象的内容项数组。我以汽车为例来说明这个问题。
过滤器看起来像这样:
const filters = {
categories: [
'car',
'van',
'motorbike',
],
tags: [
'4x4',
'petrol',
'sunroof',
]
}
然后我有一个需要在对象数组中进行过滤的内容项:
const items = [
{
title: '2016 VW Polo',
categories: [
{
title: 'Car',
slug: 'car',
}
],
tags: [
{
title: 'Sunroof',
slug: 'sunroof',
},
{
title: 'Power Steering',
slug: 'power-steering',
},
{
title: 'Petrol',
slug: 'petrol',
},
]
},
{
title: '2015 Audi A4',
categories: [
{
title: 'Car',
slug: 'car',
}
],
tags: [
{
title: 'Sunroof',
slug: 'sunroof',
},
{
title: 'Power Steering',
slug: 'power-steering',
},
{
title: 'Petrol',
slug: 'petrol',
},
{
title: '4x4',
slug: '4x4',
},
]
}
]
混淆的部分在于过滤方式不同。我需要使用OR语句来过滤,所以如果用户筛选汽车和面包车,那么它会获取包含其中任何一个的所有内容项。
然后,按标签过滤时,必须在filters.tags
数组中的所有项目都在item.tags
数组中匹配。
我已经尝试使用.forEach()
、.filter()
和.some()
,但我在让它正常工作方面遇到了困难。
谢谢!
英文:
I am building an object of filter data combined of categories & tags and I'd like to use this data to filter an array of content items that are objects. I've used cars as an example to illustrate this.
The filters will look like:
const filters = {
categories: [
'car',
'van',
'motorbike',
]
tags: [
'4x4',
'petrol',
'sunroof'
]
}
Then I have my content items that needs to be filtered in an array of objects:
const items = [
{
title: '2016 VW Polo',
categories: [
{
title: 'Car',
slug: 'car'
}
]
tags: [
{
title: 'Sunroof',
slug: 'sunroof',
},
{
title: 'Power Steering'
slug: 'power-steering',
},
{
title: 'Petrol'
slug: 'petrol',
},
]
},
{
title: '2015 Audi A4',
categories: [
{
title: 'Car',
slug: 'car'
}
]
tags: [
{
title: 'Sunroof',
slug: 'sunroof',
},
{
title: 'Power Steering'
slug: 'power-steering',
},
{
title: 'Petrol'
slug: 'petrol',
},
{
title: '4x4'
slug: '4x4',
},
]
}
]
The confusing part comes because the filtering is different. I'd need to filter this with an OR statement, so if the user filters by cars and vans, then it fetches everything with either.
Then filtering by tags is that all the items within the filters.tags
array have to be matched within the item.tags
array.
I've looked into it using .forEach()
, .filter()
and .some()
, but I'm struggling to get this working.
Thanks!
答案1
得分: 2
Your code is with syntax errors, next time please prepare a stackoverflow code snippet with proper code so anyone could copy it and answer you easily.
const filters = {
categories: [
'car',
'van',
'motorbike',
],
tags: [
'4x4',
'petrol',
'sunroof'
]
}
const items = [
{
title: '2016 VW Polo',
categories: [
{
title: 'Car',
slug: 'car'
}
],
tags: [
{
title: 'Sunroof',
slug: 'sunroof',
},
{
title: 'Power Steering',
slug: 'power-steering',
},
{
title: 'Petrol',
slug: 'petrol',
},
]
},
{
title: '2015 Audi A4',
categories: [
{
title: 'Car',
slug: 'car'
}
],
tags: [
{
title: 'Sunroof',
slug: 'sunroof',
},
{
title: 'Power Steering',
slug: 'power-steering',
},
{
title: 'Petrol',
slug: 'petrol',
},
{
title: '4x4',
slug: '4x4',
},
]
}
]
const filtered = items.filter(({tags, categories}) =>
// first filter by tags since it's more restrictive
(!filters.tags.length || filters.tags.every(tag => tags.some(({slug}) => slug === tag)))
&& (!filters.categories.length || filters.categories.some(category => categories.some(({slug}) => slug === category)))
);
console.log(filtered);
英文:
Your code is with syntax errors, next time please prepare a stackoverflow code snippet with proper code so anyone could copy it and answer you easily.
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
const filters = {
categories: [
'car',
'van',
'motorbike',
],
tags: [
'4x4',
'petrol',
'sunroof'
]
}
const items = [
{
title: '2016 VW Polo',
categories: [
{
title: 'Car',
slug: 'car'
}
],
tags: [
{
title: 'Sunroof',
slug: 'sunroof',
},
{
title: 'Power Steering',
slug: 'power-steering',
},
{
title: 'Petrol',
slug: 'petrol',
},
]
},
{
title: '2015 Audi A4',
categories: [
{
title: 'Car',
slug: 'car'
}
],
tags: [
{
title: 'Sunroof',
slug: 'sunroof',
},
{
title: 'Power Steering',
slug: 'power-steering',
},
{
title: 'Petrol',
slug: 'petrol',
},
{
title: '4x4',
slug: '4x4',
},
]
}
]
const filtered = items.filter(({tags, categories}) =>
// first filter by tags since it's more restrictive
(!filters.tags.length || filters.tags.every(tag => tags.some(({slug}) => slug === tag)))
&& (!filters.categories.length || filters.categories.some(category => categories.some(({slug}) => slug === category)))
);
console.log(filtered);
<!-- end snippet -->
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论