测验应用功能优化求助：多选题、动态答案栏及图片按需配置

1. 实现1-5个正确答案的题型切换 #

• 数据结构调整：将原单个正确答案字段（如correct_answer）改为数组类型correct_answers，例如correct_answers: [2, 4]代表第2、4个选项正确。同时新增question_type字段，用"single"（单选）或"multiple"（多选）标识题型。
• UI动态适配：根据question_type渲染对应组件：单选时用<input type="radio">并限制单选；多选时用<input type="checkbox">，同时设置最多选中5个选项的限制。
• 判分逻辑更新：把用户选中的答案整理为数组，单选时直接匹配单个值；多选时对比两个数组的元素集合是否完全一致，可通过new Set实现：

const isCorrect = new Set(userAnswers).size === new Set(correctAnswers).size 
  && [...new Set(userAnswers)].every(item => correctAnswers.includes(item))

2. 数学题按需添加公式图片 #

• 数据结构扩展：给题目模型新增可选字段formula_image_url，默认值为null。
• UI条件渲染：在题目展示区判断该字段是否存在，存在则渲染图片：

<div class="question">
  <p>{{ question.content }}</p>
  <img src="{{ question.formula_image_url }}" alt="数学公式" class="formula-img" 
       style="display: {{ question.formula_image_url ? 'block' : 'none' }}">
</div>

• 上传交互支持：在出题页面添加图片上传组件，将上传后的图片URL存入formula_image_url，同时提供预览、删除功能。

3. 答案栏灵活设置为2-6个选项 #

• 动态选项结构：把固定4个选项的字段（如option1-option4）改为数组options，例如options: ["选项A", "选项B"]，数组长度控制在2-6之间。
• UI循环渲染：遍历options数组生成选项，无需固定DOM元素：

// 示例（Vue）
<div v-for="(option, idx) in question.options" :key="idx" class="option">
  <input :type="question.type === 'single' ? 'radio' : 'checkbox'" 
         :name="`answer-${question.id}`" :value="idx">
  <span>{{ option }}</span>
</div>

• 选项增减控制：在出题页面添加「添加选项」「删除选项」按钮，点击时修改options数组长度，同时限制最小2个、最大6个选项：点击添加时push空字符串，点击删除时pop最后一个元素（或支持删除指定选项）。

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