gpt4 book ai didi

javascript - 单选按钮在 Vue.js 中无法正常工作

转载 作者:行者123 更新时间:2023-11-30 15:21:52 25 4
gpt4 key购买 nike

我在一个页面中生成了多个单选按钮组。每个组由两个项目组成 - yesno

<div v-if="row.answer_input_type === 'Radio Button'">
<template v-for="answer in answers" >
<template v-if="answer.AnswerTypeID === row.answer_type_id">
<template v-for="answerdesc in answer.AnswerDescription">
<p>{{answerdesc.AnswerMasterID}}</p>
<input type="radio" v-bind:value="answerdesc.AnswerMasterID" v-bind:name="row.question_id" v-bind:id="answerdesc.AnswerMasterID" v-bind:disabled="row.is_enabled == 1 ? false : true" v-on:click="rdoClick(row.question_id, answerdesc.AnswerMasterID)" v-model="answer.selected_option" />
<label v-bind:for="answerdesc.AnswerMasterID">{{answerdesc.AnswerDescription}}</label>
</template>
</template>
</template>
</div>

但是每当单选按钮组中的选择发生变化时,所有其他单选按钮组都会反射(reflect)相同的情况。也就是说,如果我在一个组中选择是,则在所有其他组中选择是。但是每个 v-model 都是不同的。如何解决/纠正这个问题?谢谢

最佳答案

对单选按钮使用 name 属性,如下面的代码所示,您的单选按钮应该在表单中。
例如:姓名=“性别”

<form action="post">
<div>
<div class="label">Gender <span class="required">*</span></div>
<label>
<input type="radio" required name="gender" v-model="gender" value="F">F
</label>
<label>
<input type="radio" required name="gender" v-model="gender" value="M">M
</label>
</div>
<button type="button">Submit</button>
</form>

关于javascript - 单选按钮在 Vue.js 中无法正常工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43607595/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com