2 回答
![?](http://img1.sycdn.imooc.com/5f33c0c90001f9ad05720572-100-100.jpg)
TA贡献1155条经验 获得超0个赞
也许您可以这样做,将过滤器作为具有单个键/值对的对象数组传递。然后,您可以单独过滤它们并在至少一个过滤器匹配时返回事件。
这应该允许您过滤多个过滤器类别以及这些类别中的多个值。
const filters = [{ city: 'Moscow' }, { city: 'Kiev' }, { distances: '42km'} ];
events.filter(event => {
// will return true if one of the filtered values is present in the event object
return filters.some(filter => {
return hasFilteredProperty(event, filter);
});
});
// Pass filter as { key: value }
const hasFilteredProperty = (event, filterObj) => {
const filterKey = Object.keys(filterObj)[0];
if (filterKey === 'tags') {
return hasFilteredTags(event, filterObj[filterKey]);
} else {
return event[filterKey] === filterObj[filterKey];
}
}
// Pass filtered tags as an array of names: [ 'Half Marathon', 'Marathon', '100km' ]
const hasFilteredTags = (event, filteredTags) => {
const eventTagNames = event.tags.map(tag => tag.name);
return eventTagNames.some(tagName => filteredTags.includes(tagName));
}
![?](http://img1.sycdn.imooc.com/54584f3100019e9702200220-100-100.jpg)
TA贡献1807条经验 获得超9个赞
您可以使用数组includes函数来检查事件所在城市是否存在于filterCity. 对于其他类似的属性,您可以执行相同的操作。对于标签,因为事件属性本身是一个对象数组,您可以首先使用创建标签名称数组,map然后检查是否filterTag存在至少一个元素。演示代码如下所示。
let filterCity = ['Moscow', 'Russia']
let filterTag = ['Relay','Marathon']
let filteredEvent = events.filter(event => {
if(filterCity.length && !filterCity.includes(event.city)) return false
if(filterTag.length && event.tags.map(tag => tag.name).find(tag => filterTag.indexOf(tag)>-1)==undefined) return false
return true
})
console.log(filteredEvent)
添加回答
举报