在这个场景下，您想根据`formDatas`中的数据对表单进行初始化，并确保当`question_type`为1（即单选题）时能够正确地显示选择项。对于`question_type`为1的情况，默认情况下`v-model`绑定的是一个单独的值而不是数组，所以在处理这种类型的回显时需要特别注意。 您可以按照下面的方式调整代码： ### 解决方案 #### 修改点一：适配 `formData` 在设置初始状态时，针对每种问题类型分别处理： ```javascript let formData = {}; formDatas.forEach(item => { if (item.question_type === 1 && Array.isArray(item.option_code)) { // 对于单选项, 确保只取第一个元素作为默认值 formData[item.question_code] = item.option_code.length ? item.option_code[0] : ''; } else { // 其他情况直接赋值即可 formData[item.question_code] = item.option_code; } }); ``` 这里的关键在于如果遇到`question_type`等于1并且其对应的答案是数组形式，则我们只需要提取出该数组的第一个元素来做为单选按钮的默认值。（假设此设计意图是在有多个“正确”答案的情况下仅展示其中一个） #### 修改点二：确保模板逻辑一致 另外需要注意的一点是要保证HTML模版内的逻辑和JavaScript部分保持同步。您的现有代码片段已经很好地实现了这一点，在渲染不同种类的问题时会根据不同条件加载相应的组件（如`el-radio-group`或`el-checkbox-group`），因此这部分无需更改。 最后别忘了将准备好的`formData`对象传入到`<el-form>`标签中以便它能用于双向绑定(`:model="formData"`). ### 示例完整修改后的代码 考虑到上述两点建议之后完整的示例可能是这样的: ```html <script setup> import { reactive } from 'vue'; // 假设这是从服务器获取的数据结构... const formDatas = [ {"question_code":"que_155072415507025920","question_type":1,"option_code":["opt155072415507025921"]}, {"question_code":"que_155073352741031936","question_type":1,"option_code":["opt155073352741031938"]}, {"question_code":"que_155074051071676416","question_type":2,"option_code":["opt155074051071676417","opt155074051071676423"]} ] // 初始化 formData const formData = reactive({}); formDatas.forEach(item => { if (item.question_type === 1 && Array.isArray(item.option_code)) { formData[item.question_code] = item.option_code.length ? item.option_code[0] : ''; } else { formData[item.question_code] = item.option_code; } }); </script> <template> <el-form :model="formData" ref="formRefs"> <!-- ...原有的循环代码... --> </el-form> </template> ``` 以上就是解决这个问题的办法了！