如何基于t_name_food字段过滤多对象嵌套数组？

你的问题出在对数组方法的使用逻辑上——forEach没有返回值，而且内层filter的结果也没被正确保存到原数组里。咱们一步步来修正：

问题分析 #

你原来的代码用forEach遍历数组，但forEach只是执行回调操作，不会返回新数组，直接把它的返回值（undefined）赋值给this.lista_categoria_food会直接清空原数组。另外，内层的filter虽然做了匹配判断，但你没把过滤后的结果赋值回item.list_food，所以原数据根本没发生变化。

正确实现方案 #

根据你的需求，分两种常见场景给出代码：

场景1：保留所有分类，仅更新分类下的匹配食物

如果你想保留所有分类条目，只是把每个分类里的list_food替换成匹配搜索关键词的项：

// 先把搜索关键词转成小写，避免大小写敏感问题
const searchLower = searchTerm.toLowerCase();

this.lista_categoria_food = this.lista_categoria_food.map(category => {
  // 过滤当前分类下符合条件的食物
  const matchedFoods = category.list_food.filter(food => 
    food.t_name_food.toLowerCase().includes(searchLower)
  );
  // 返回新的分类对象（用展开运算符避免修改原数据，更符合函数式编程习惯）
  return { ...category, list_food: matchedFoods };
});

场景2：仅保留包含匹配食物的分类

如果某个分类下没有匹配的食物，你想直接移除这个分类条目：

const searchLower = searchTerm.toLowerCase();

this.lista_categoria_food = this.lista_categoria_food
  .map(category => {
    const matchedFoods = category.list_food.filter(food => 
      food.t_name_food.toLowerCase().includes(searchLower)
    );
    return { ...category, list_food: matchedFoods };
  })
  // 过滤掉没有匹配食物的分类
  .filter(category => category.list_food.length > 0);

可选：直接修改原数组（不创建新对象）

如果你不在意修改原数据，也可以用forEach配合赋值来实现：

const searchLower = searchTerm.toLowerCase();

// 先更新每个分类的食物列表
this.lista_categoria_food.forEach(category => {
  category.list_food = category.list_food.filter(food => 
    food.t_name_food.toLowerCase().includes(searchLower)
  );
});

// 如果需要移除空分类，再加一步过滤
this.lista_categoria_food = this.lista_categoria_food.filter(c => c.list_food.length > 0);

关键要点 #

• 用map来生成新的数组条目，而不是forEach（forEach无返回值）
• 内层的filter结果必须赋值回对应的list_food字段，才能让数组更新
• 统一转成小写可以避免大小写敏感的匹配问题，提升用户体验

内容的提问来源于stack exchange，提问作者Stefani Toto