如何检查数组的至少一项是否包含在 object 的数组中并遍历所有对象（JS）

Question

我搜索了这个并发现了类似的问题，但我无法为我的具体案例找到解决方案，所以如果这是重复的，我很抱歉。

我正在尝试为我的网站构建一个过滤器并遇到了这个问题。 我有一个标记对象数组，每个标记对象都有一个标签数组（我将其命名为“类型”）。

当用户选择应显示的标记类型时，它们将被添加到“selectedFilters”数组中，该数组包含所有选定的过滤器类型作为字符串。 现在我想做的是，我只想显示标记数组，按所选类型过滤。 这意味着如果标记对象在其类型数组中包含至少一种选定类型，则应显示它。

const markers = [
{
type: ['Paper', 'Plastic']
},
{
type: ['Burnable', 'Plastic']
}
{
type: ['NotBurnable']
}
.
.
.
]

const selectedFilters = ['Burnable', 'Plastic']

const filteredMarkers = ????

我的想法是使用过滤器和一些方法来检查是否至少一个过滤器与每个 object 中的类型数组匹配，并仅返回通过的对象。 我已经到了可以使用硬编码字符串作为过滤器而不是实际的arrat来做到这一点的地步：

const filteredMarkers = this.markers.filter(
          marker => marker.type.some( type => type == 'Plastic') 
        )

如何用实际数组替换硬编码字符串并循环遍历它？ 感谢任何建议、提示和建议。 顺便说一句，这是一个 vue 项目。 也许在 vue 中构建过滤器有不同的方法？

Answer 1

你的尝试非常接近。 您只需要检查selectedFilters .includes()是否是其中一种标记类型。

 const markers = [ { type: ['Paper', 'Plastic'] }, { type: ['Burnable', 'Plastic'] }, { type: ['NotBurnable'] } ] const selectedFilters = ['Burnable', 'Plastic'] const filteredMarkers = markers.filter( marker => marker.type.some(type => selectedFilters.includes(type)) ) console.log(filteredMarkers)

Answer 2

const markers = [
    {
        type: ['Paper', 'Plastic']
    },
    {
        type: ['Burnable', 'Plastic']
    },
    {
        type: ['NotBurnable']
    }
]

const selectedFilters = ['Burnable', 'Plastic']

const filteredMarkers = markers.filter(function(marker, index, arr) {
    return marker.type.some(type => selectedFilters.includes(type));
});

console.log(filteredMarkers);