项目开发中常用的单选组件例如el-radio、u-radio 组件自身是不支持取消选中,一旦选择了就只能切换选项不能取消选中。而实际开发中有些需求是希望单选按钮不但能够切换同时还允许取消选择。
通过js操作实现取消选择
<el-radio-group v-model="value">
<el-radio label="1" @click.native="handleTrigger($event)">正常</el-radio>
<el-radio label="2" @click.native="handleTrigger($event)">异常</el-radio>
</el-radio-group>
handleTrigger($event){
let _this = this;
let objVal = this.value;
window.setTimeout(() => {
if (!!objVal && objVal == $event.target.value) {
$event.target.checked = false
_this.value= ''
}
}, 0);
}
原文链接:vue取消单选按钮选中,所有类型通用简单明了_vue单选框选中怎么取消_MyAzhe0ci3的博客-CSDN博客