React中如何将array2的current_value添加至同filter_id的array1元素？

数据老陈

2026-8-25

实现将array2的current_value匹配添加到array1对应元素中

可以通过数组遍历+匹配查找的方式实现，同时遵循React状态不可变更新的原则：

基础实现方案

遍历productsFiltersSlider数组，对每个元素在filteredValuesSlider中找到filter_id一致的项，将current_value字段合并进去：

// 确保productsFiltersSlider已完成初始化（不是undefined）
if (!productsFiltersSlider) return;

const mergedFilters = productsFiltersSlider.map(filterItem => {
  // 查找对应filter_id的current_value
  const matchedValue = filteredValuesSlider.find(
    valueItem => valueItem.filter_id === filterItem.filter_id
  );
  // 合并字段，返回新对象（不修改原状态）
  return matchedValue 
    ? {...filterItem, current_value: matchedValue.current_value} 
    : filterItem;
});

// 更新状态
setProductsFiltersSlider(mergedFilters);

性能优化方案（适合大数据量）

如果两个数组元素较多，用Map预先构建filter_id到current_value的映射，把查找时间从O(n)降到O(1)：

if (!productsFiltersSlider) return;

// 构建映射表
const valueMap = new Map(
  filteredValuesSlider.map(item => [item.filter_id, item.current_value])
);

const mergedFilters = productsFiltersSlider.map(filterItem => ({
  ...filterItem,
  // 若找不到匹配项，可选择保留原有current_value（如果存在）或设为空
  current_value: valueMap.get(filterItem.filter_id) ?? filterItem.current_value ?? ''
}));

setProductsFiltersSlider(mergedFilters);