React Native中嵌套mapping对象遍历无法渲染CustomCard如何解决？

• 外层map无返回值：你使用带花括号{}的箭头函数编写外层map的回调逻辑，该语法默认不会返回执行结果，仅运行了内层map但没有将生成的CustomCard组件数组返回给React，因此不会渲染对应内容。
• 可选优化项：原有key属性拼接规则存在缺陷，你将对象类型的value直接转为字符串拼接，会得到固定的[object Object]内容，容易出现重复key，会影响React的更新性能，极端情况下会引发渲染异常。

给外层map添加返回语句，返回内层map的执行结果即可，同时可以优化冗余变量和key取值：

{Object.entries(exceptions).map(([key, value]) => {
  // 新增return语句返回内层map生成的组件数组
  return Object.entries(value).map(([num, photo]) => {
    return (
      <CustomCard
        questionNumber={num}
        questionType={key}
        image={photo}
        // 用外层key+内层num保证唯一，避免重复key
        key={`${key}-${num}`}
      />
    );
  });
})}

你也可以使用箭头函数的隐式返回语法简化写法，省略花括号和return关键字：

{Object.entries(exceptions).map(([key, value]) => 
  Object.entries(value).map(([num, photo]) => (
    <CustomCard
      questionNumber={num}
      questionType={key}
      image={photo}
      key={`${key}-${num}`}
    />
  ))
)}

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