一、需求描述

最近遇到Vant的单选组件的一个交互需求：需要在单选选项选中时再次点击能够取消选中状态：

二、实现代码

<van-radio-group v-model="form.type" direction="horizontal">
   <van-radio :name="1" @click.capture="handleClick('type', 1)">单选框1</van-radio>
   <van-radio :name="2" @click.capture="handleClick('type', 2)">单选框2</van-radio>
 </van-radio-group>

const form = ref({
    
    
	type: ''
})
const handleVisitTypeCClick = (field, v) => {
    
    
 if (form.value[field] == v) {
    
    
   setTimeout(() => {
    
    
     form.value[field] = ''
   }, 50)
 } else {
    
    
   form.value[field] = v
 }

 return false
}