【Vue】vue使用iViewui组件,循环绑定radio、checkbox组件的v-model值,如何获取选中的数据并提交?

        <Row type="flex" justify="start" v-for="(item,index) in questions" :key="item.id">

<div class="question">

<h5 class="question_title">{{index+1}}.{{item.title}}</h5>

<RadioGroup v-if="item.questionType == '单选题'" v-model="answerInfo[index].singlechoice_default" vertical>

<Radio v-for="(it,i) in item.options" :label="it.id" :key="it.id" :checked.native="item.checked">

<span v-if="it.optionContent.indexOf('#OTHER#') == '-1'">{{it.optionContent}}</span>

<span v-else>其他<Input v-if="it.optionContent.indexOf('#OTHER#') != '-1'"></Input></span>

</Radio>

</RadioGroup>

<CheckboxGroup v-else-if="item.questionType == '多项选择题'" v-model="answerInfo[index].multichoice_default">

<Checkbox v-for="(it,i) in item.options" :label="it.id" :key="it.id" :checked.native="item.checked">

<span v-if="it.optionContent.indexOf('#OTHER#') == '-1'">{{it.optionContent}}</span>

<span v-else>其他<Input v-if="it.optionContent.indexOf('#OTHER#') != '-1'"></Input></span>

</Checkbox>

</CheckboxGroup>

<Input v-else v-model="item.input_value" type="textarea" :rows="6" placeholder="请输入内容..."></Input>

</div>

</Row>

data() {

return {

questionId:'',

questionDetail: {},

questions: [],

singlechoice_default: '',

multichoice_default:[],

answerInfo: [],

};

},

created() {

this.getQuestionDetail();

},

getQuestionDetail() {

this.$get("course/list.json",{

courseId: this.$route.query.id

},response => {

this.questionDetail = response.data[0];

this.questionId = response.data[0].questionId;

this.getDetail(this.questionId);

}

);

},

getDetail(questionid) {

this.$get("info/list.json",{

questionid: questionid

},response => {

response.data.forEach((item,index,arr) => {

if (item.questionType === "多项选择题") {

item.multichoice_default = this.multichoice_default;

} else if (item.questionType === "单选题") {

item.singlechoice_default = this.singlechoice_default;

} else {

}

});

this.answerInfo = response.data;

this.questions = response.data;

}

);

},

}

【Vue】vue使用iViewui组件,循环绑定radio、checkbox组件的v-model值,如何获取选中的数据并提交?

【Vue】vue使用iViewui组件,循环绑定radio、checkbox组件的v-model值,如何获取选中的数据并提交?
vue新手,求各位大神指教。

如何获取选中的数据并提交?

回答

好像是直接循环遍历answerInfo获取里面的singlechoice_defaultmultichoice_default就可以了。。。

呵呵,好丢人,捂脸-_-||

change事件吧item传出来
或者看文档提供事件没有

<RadioGroup @on-change="handleChange()" v-if="item.questionType == '单选题'" v-model="answerInfo[index].singlechoice_default" vertical>
</RadioGroup>

method里面handleChange(val)取val

可以使用楼上的on-change 或者直接在watch中监听answerInfo

以上是 【Vue】vue使用iViewui组件,循环绑定radio、checkbox组件的v-model值,如何获取选中的数据并提交? 的全部内容, 来源链接: utcz.com/a/84188.html

回到顶部