# 組件名：hsAnswer（問卷調查動態表單組件） ### 作者：屈磊 ### 效果：  ## 使用方式： ``` import hsAnswer from './answer/hs-answer.vue' import?hsAnswerJs?from'./answer/mixins/hs-answer' 事件方法 <hsAnswer :rule-form="ruleForm" :answer-dada="answerDada" @submitForm="submitForm" /> ## 數據結構模板： 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?|??|??是?|???|