请注意,本文编写于 1339 天前,最后修改于 1315 天前,其中某些信息可能已经过时。
如题,需求如此, 使用的 vue
的 ui
框架 elementUI
,需要实现 radio
再次点击可以取消选中状态
<el-radio-group v-model="radioValue">
<el-radio
@click.native.prevent="handleRadioClick(1)"
:label="1">备选项1</el-radio>
<el-radio
@click.native.prevent="handleRadioClick(2)"
:label="2">备选项2</el-radio>
<el-radio
@click.native.prevent="handleRadioClick(3)"
:label="3">备选项3</el-radio>
</el-radio-group>
handleRadioClick(val) {
this.radioValue === val ? this.radioValue = '' : this.radioValue = val
},
主要就是 @click.native.prevent
的运用,直接使用 @click
无法监听到 点击
事件, 需要使用 原生click
事件, 后面加上 .prevent
会阻止后续事件的触发(比如使用后 el-radio
的change
事件 就不会触发了)