React渲染数据库拉取的Quiz题目数组时报错：对象无法作为React子元素

该报错和你拉取题目、随机打乱的逻辑无关，是React渲染阶段的规则触发的：
React仅支持渲染字符串、数字、React元素，或是由上述合法元素组成的数组，不支持直接渲染普通JS对象。报错提示中提到的带number/answer/isCorrect键的对象，就是题目下的单个选项数据，你在渲染选项时直接把整个选项对象作为子元素传入，没有提取实际要展示的文本字段，才会抛出该错误。

你给出的随机排序逻辑本身无问题：通过不断从剩余题目数组中随机抽取、抽完即删除的方式，实现了无重复的题目随机排列，fetch请求、数据处理、setState更新状态的流程均符合预期。

• 修正所有渲染题目、选项的JSX代码，禁止直接输出完整对象，必须拆解到具体的展示字段：
  错误示例（会触发报错）：

  // 直接把选项对象作为子元素传入
  {question.choices.map(choice => <div>{choice}</div>)}
  

  正确示例（根据你的数据结构，选项文本存于answer字段）：

  // 补充列表循环必需的key属性
  {question.choices.map(choice => (
    <div key={choice.number}>{choice.answer}</div>
  ))}
  

• 如果渲染题干的代码也存在直接输出题目对象的情况，同步修改为提取题干对应的实际展示字段（如question.stem、question.content等你的数据结构中对应题干文本的字段）。

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