# 组件名：hsAnswer（在线考试简易组件） ### 作者：屈磊 ### 效果：  ## 使用方式： ``` import hsExam from './answer/hs-exam.vue' import hsAnswerJs from'./answer/mixins/hs-answer' 事件方法 <hsExam :rule-form="ruleForm" :answer-dada="answerDada" :activeNumber="activeNumber" @clickPrev="clickPrev" @clickNext="clickNext" @submit="submit" /> ## 数据结构模板： getData() { for (let index = 0; index < 4; index++) { const type = Math.floor(Math.random() * 3 + 1) let topicType if (type === 1) { topicType = '单选' const key = 'radio' + index this.$set(this.ruleForm, key, '') } else if (type === 2) { topicType = '多选' const key = 'checkbox' + index this.$set(this.ruleForm, key, []) } else { const key = 'textarea' + index this.$set(this.ruleForm, key, '') } if (type === 3) { this.answerDada.push( { textarea: index + 1 + '.请提出您的宝贵意见，我们将不断改进，为您提供优质的文化内容：', id: Math.random() * 10, index: index + 1, type: type, required: true } ) } else { this.answerDada.push( { id: Math.random() * 10, index: index + 1, type: type, /题目类型 1 单选 2 多选 3 问答题 required: true, //题目是否必填 topic: index + 1 + '.请问您最喜爱的资源类型是？【' + topicType + '】', //题目标题 children: [ //题目选项 { option: 'A', answer: '新闻咨询类' }, { option: 'B', answer: '图片展示类' }, { option: 'C', answer: '视频类' }, { option: 'D', answer: '直播类' } ] } ) } } },                            ``` ### 说明： // 表单数据 ruleForm { radio + 数字 单选第几题 如 radio1 单选题题目数列号1 checkbox +数字 多选第几题 如 checkbox2 多选题目数列2 textarea +数字 填空第几题 如 textarea3 填空题目数列3 } answerDada :[] 接受的题目数据 问卷/考试数据结构一致，可通用，只有答题部分， ### 参数： | 参数 | 作用 | 类型 | 默认 | 是否必传 | 属性 | | --- | --- | --- | --- | --- | --- | |answerDada|题目数据 |  Array |  |  是 |   | |ruleForm|答题表单数据|  Object |  |  是 |   | |activeNumber|考试的题目的数列号|Number| 0 |  是 |   |