🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
# 组件名:hsAnswer(在线考试动态表单组件) ### 作者:屈磊 ### 效果: ![](https://img.kancloud.cn/cb/de/cbdeffdaf0ee707d4f711d22952dbf48_1165x789.png) ![](https://img.kancloud.cn/5d/02/5d02ab737585e67220352cdbed6aa16a_1147x774.png) ## 使用方式: ``` import hsExamAll from './answer/hs-exam-all.vue' import hsAnswerJs from'./answer/mixins/hs-answer' 事件方法 <hsExamAll :ruleForm="ruleForm" :answerDada="answerDada" :activeNumber="activeNumber" :isStart="isStart" :examinesAnswerStatus="examinesAnswerStatus" :allTime="allTime" :countTime="countTime" @clickPrev="clickPrev" @clickNext="clickNext" @startTime="startTime" @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 :[] 接受的题目数据 问卷/考试数据结构一致,可通用 countTime: "00:30:00", //答题限定完成时间 timeInterval: null, //定时 updateTime: 30 * 60 * 1000, //默认 30 分钟内需完成答题 allTime: 30,//答题时间 isStart: false, //是否开始 activeNumber: 0, // 答题开始题目的数列号 examinesAnswerStatus: 0,//考试结果 1 合格,2不合格 ### 参数: | 参数 | 作用 | 类型 | 默认 | 是否必传 | 属性 | | --- | --- | --- | --- | --- | --- | |answerDada|题目数据 |  Array |  |  是 |   | |ruleForm|答题表单数据|  Object |  |  是 |   | |activeNumber|考试的题目的数列号|Number| 0 |  是 |   | |countTime|倒计时时间|String| 00:30:00 |  是 |   | |isStart|答题表单数据|Boolean| false |  是 |   | |examinesAnswerStatus|考试结果|Number|0|  是 |   | |allTime|答题总时长|Number|30|  是 |   |