Ant-Design-Vue 单击取消单选框radio选中效果

blhbay

于 2021-07-21 08:58:41 发布

阅读量5.5k

点赞数

分类专栏： vue 学习

本文链接：https://blog.youkuaiyun.com/qq_36840358/article/details/118958255

版权

学习同时被 2 个专栏收录

54 篇文章

订阅专栏

vue

6 篇文章

订阅专栏

这篇博客介绍了如何使用A-Radio-Group组件实现单选框的值切换功能。当值为0时，点击选项A将清空值；值为1时，点击选项B同样清空值。代码示例中展示了Vue.js的模板和方法部分，用于处理单选按钮的点击事件。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

主要是通过当前对应的值来判断。例子：选项A、B分别对应值0、1，分别对两个单选框进行判断：如果当前值为0，即选中选项A，此时再点击选项A则将值置空；选项B同理。

//<template>
<a-radio-group v-model="radioData">
  <a-radio-button :value="0" @click="A">是</a-radio-button>
  <a-radio-button :value="1" @click="B">否</a-radio-button>
</a-radio-group>



//<script>中的methods
data() {
  return {
    radioData:"",
  }
},
methods: {
  A() {
    if(this.isIncomplete==0){
  	  this.isIncomplete="";
    }
  },
  B() {
    if(this.isIncomplete==1){
      this.isIncomplete="";
    }
  },
}