在vue.js中筛选2个或更多类别

我有一个代码，其中我过滤了一个具有特定类别的数组

response.data.items.filter(item => item.category_id === categ_id_1)

现在，我想在过滤器中添加更多类别（categ_id_2，categ_id_3）。我该怎么做呢？

试试看

---

response.data.items.filter（item=>item.category\u id===categu id\u 1 | | item.category\u id===categu id\u 2 | | item.category\u id==categu id\u 3）

假设

category\u id

是一个原语（即字符串、数字等），我能想到的最简单的方法是维护一系列想要的类别并用于过滤

const categories=新集合（['categ\u id\u 1'，'categ\u id\u 2'，…]））
response.data.items.filter（（{category\u id}）=>categories.has（category\u id））

---

如果您希望列表在Vue中具有反应性，请执行以下操作

数据：（）=>({
categoryFilters:['Categu id_1'、'Categu id_2']
}),
计算：{
类别过滤器集（）{
返回新集合（此.categoryFilters）
}
},
方法：{
异步loadAndFilterData（）{
const response=await axios（{…}）//只是猜测
const filtered=response.data.items.filter（{category\u id}）=>
this.categoryFilterSet.has（category_id））
}
}

使用computed属性的原因是Vue不能与

Set

协同工作，因此必须使用数组对其进行备份。

另一种方法用于通过/失败每个元素的

过滤器测试


const项=[{
“a”：1，
“类别id”：“类别id 1”
}, {
“a”：2，
“类别id”：“类别id 2”
}, {
“a”：3，
“类别id”：“类别id 3”
}, {
“a”：4，
“类别id”：“类别id 4”
}, {
“a”：5，
“类别识别号”：“类别识别号5”
}];
常量搜索=[“类别id 2”、“类别id 3”]；
const result=items.filter（e=>search.includes（e.category_id））；
控制台信息（“结果：：”，结果）哪些类别？它们是字符串、数字还是其他东西？是的，我把它们放在一个常量中