我正在尝试弄清js filter()的工作方式。
我有一个API,该API返回如下内容:
[
{
"name": "Category 1",
"items": [
{
"name": "Vacancy item #1",
"location": "Los Angeles",
"overview": "Lorem ipsum",
"get_absolute_url": "/careers/vacancy-item-1/"
},
{
"name": "Vacancy item #2",
"location": "Los Angeles",
"overview": "Lorem ipsum",
"get_absolute_url": "/careers/vacancy-item-2/"
}
]
},
{
"name": "Category 2",
"items": [
{
"name": "Vacancy item #3",
"location": "Washington D.C",
"overview": "Lorem ipsum",
"get_absolute_url": "/careers/vacancy-item-3/"
}
]
}
]
我想根据表单的选择值过滤此数据。我正在研究VUE.JS和Django。
这是我的JS代码
filteredItems() {
let vacancycategories = this.listData,
city = this.city,
category = this.category
if (city && city.length > 0) {
vacancycategories = vacancycategories.filter((cat) => {
cat.items = cat.items.filter((vacancy) => {
return vacancy.location.indexOf(city) !== -1
})
return cat
})
}
if (category && category.length > 0) {
vacancycategories = vacancycategories.filter((cat) => {
return cat.name.indexOf(category) !== -1
})
}
return vacancycategories
}
类别部分按预期工作。但是,当我尝试过滤位置字段时,它无法正常工作。第一个选择的选项正常工作,但是当您选择另一个选项时,它将返回一个空列表。
答案 0 :(得分:5)
每个过滤器函数都需要返回布尔值。
内部过滤器功能很好,但是外部过滤器功能需要更改。
进行以下更改应该可以。
vacancycategories = vacancycategories.filter(cat => {
return (
cat.items.filter(vacancy => {
return vacancy.location.indexOf(city) !== -1;
}).length > 0
);
});