本文主要是介绍el-radio单选框的选中与取消，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
需求是有一个单选框，点击选中，再次点击取消。
第一次写的时候代码如下：
<el-radio-group v-model="keyForm.highlight"><el-radio:value="true"@click="handleClick">是</el-radio>
</el-radio-group>
handleClick() {this.keyForm.highlight = !this.keyForm.highlightconsole.log(this.keyForm.highlight)
},
结果为：第一次点击时选中，之后多次点击都是选中，且控制台输出为false。这很奇怪？？
true
false
false
false
...
查阅资料发现这是因为：原生click事件会执行两次，第一次在label标签上，第二次在input标签
因此，我们需要阻止默认事件的发生即可：
<el-form-itemlabel="是否突出"prop="highlight"><el-radio-group v-model="keyForm.highlight"><el-radio:value="true"@click.prevent="keyForm.highlight = !keyForm.highlight">是</el-radio></el-radio-group></el-form-item>
这篇关于el-radio单选框的选中与取消的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
