如何基于自定义输入过滤对象数组（多选下拉场景）

你的核心问题是每次筛选后将结果追加到finalArr，而非替换原有内容，同时代码可以更简洁高效。以下是修正方案：

1. 直接替换结果数组（推荐） #

不需要用forEach循环逐个筛选后追加，利用数组的filter和includes方法，直接生成新的过滤结果并赋值给finalArr，覆盖原有内容：

针对ServiceArea筛选： #

// 筛选ServiceArea为["NON-CIO"]的项
const serviceAreaFilter = ["NON-CIO"];
this.finalArr = this.airData.filter(item => serviceAreaFilter.includes(item.ServiceArea));

针对ManagingDirector筛选： #

// 筛选ManagingDirector为["dfg","qwe"]的项
const mdFilter = ["dfg","qwe"];
this.finalArr = this.airData.filter(item => mdFilter.includes(item.ManagingDirector));

2. 通用筛选函数（适配多字段场景） #

如果需要支持不同字段的筛选，可以封装一个通用函数，避免重复代码：

// 通用过滤函数：参数为要筛选的字段名、筛选值数组
filterData(fieldName, filterValues) {
  // 直接赋值覆盖原有结果，而非追加
  this.finalArr = this.airData.filter(item => filterValues.includes(item[fieldName]));
}

// 调用示例：
// 第一次筛选ServiceArea
this.filterData("ServiceArea", ["NON-CIO"]);
// 第二次筛选ManagingDirector
this.filterData("ManagingDirector", ["dfg","qwe"]);

3. 原代码问题分析 #

你之前的代码用forEach循环每个筛选值，每次筛选后用push.apply追加结果到finalArr，这会导致：

• 多次筛选的结果叠加，而非替换
• 重复调用filter遍历整个数组，效率较低

直接用filter + includes可以一次性完成筛选，同时赋值操作会直接替换finalArr的内容，符合你预期的结果。

注意事项 #

你的示例数组存在语法错误：每个对象的属性末尾缺少逗号（比如第一个对象的"Manager": "xyz"后没有逗号），需修正后才能正常运行。

内容的提问来源于stack exchange，提问作者Rahul Jain