数据过滤 Javascript(嵌套字典和数组)
Posted
技术标签:
【中文标题】数据过滤 Javascript(嵌套字典和数组)【英文标题】:Data filtering Javascript (Nested dictionary and arrays) 【发布时间】:2020-05-23 16:32:00 【问题描述】:我试图弄清楚 js filter() 是如何工作的。
我有一个 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
类别部分按预期工作。但是当我尝试过滤位置字段时,它无法正常工作。第一个选择的选项正常工作,但是当您选择另一个选项时,它返回一个空列表。
【问题讨论】:
“我有一个 API,就像这样” - 这不是一个“API”,而是一个对象数组 你需要更清楚你想要什么。过滤位置是什么意思。您是否仍应获取所有类别并仅删除不匹配的位置,还是应仅获取具有匹配位置的类别?在这种情况下,所有位置应该仍然在 items 数组中,还是只在具有匹配位置的位置? @Millenjo 我只想过滤具有匹配位置和类别的职位空缺。如果该类别没有相关的位置,它应该消失。我希望这很清楚。我不是以英语为母语的人。 【参考方案1】:每个过滤器函数都需要返回布尔值。 内部过滤功能很好,但外部过滤功能需要更改。 以下更改应该有效。
vacancycategories = vacancycategories.filter(cat =>
return (
cat.items.filter(vacancy =>
return vacancy.location.indexOf(city) !== -1;
).length > 0
);
);
【讨论】:
感谢您的回答。现在我的过滤器正在处理位置过滤器。但是类别还有另一个问题。我的意思是当我尝试使用位置进行过滤时,数据也会转换具有该位置的整个类别。我只需要在类别中显示确切的位置。以上是关于数据过滤 Javascript(嵌套字典和数组)的主要内容,如果未能解决你的问题,请参考以下文章