React中如何从数组对象形式的Context数据提取含hat的title

问题原因 #

你用categoriesMap[0]访问数据无效，核心问题是**categoriesMap是对象类型，不是数组**。对象的键是category变量对应的字符串，没法通过数字索引直接访问内部数据。

实现步骤 #

要提取所有title包含'hat'的分类，得先把对象的取值转换成数组，再做过滤：

• 用Object.values(categoriesMap)获取对象里所有的分类数组集合
• 用flat()把二维数组转成一维（因为每个分类项本身是数组包裹的对象）
• 用filter()筛选title包含'hat'的项（转小写处理，避免大小写匹配遗漏）

代码示例 #

// 先通过Context拿到categoriesMap
const { categoriesMap } = useContext(YourContextName);

// 筛选出所有title含'hat'的分类对象
const hatRelatedCategories = Object.values(categoriesMap)
  .flat()
  .filter(item => item.title.toLowerCase().includes('hat'));

// 如果只需要提取title字符串数组
const hatTitles = hatRelatedCategories.map(item => item.title);

边界处理（可选） #

如果存在categoriesMap未初始化的情况，可以加空值判断：

const hatRelatedCategories = categoriesMap 
  ? Object.values(categoriesMap).flat().filter(item => item.title.toLowerCase().includes('hat'))
  : [];

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