从另一个按钮中取消选中vue单选按钮

Question

我有一个表，其中有一个记录列表，每个记录都有两个相关的单选按钮，一个用于确认付款，另一个用于拒绝。当我点击任何单选按钮时，我会得到一个带有两个按钮的模式屏幕，一个是明确确认付款，如果标记了错误的单选按钮则另一个是取消，我需要的是，当我点击取消按钮时，我最初标记的单选按钮未选中

参见图1

参见图2

这是我在Vue:中的代码

<v-col class="text-center">                           
<span class="radio-registered pt-1 px-1">
<input type="radio" 
@change="dlgComments = !dlgComments; setUpdateData(1, 2, flt.user_payment_id, flt.payment_amount, flt.pay_date, flt.email, flt.user_name, flt.due_concept, flt.payment_reference, flt.student_due_detail_id); sendInfo(flt), sendInputId(`filter${f}`)" 
:name="`filter${f}`" 
:checked="false">
</span>           
</v-col>
<v-col class="text-center">         
<span class="radio-rejected pt-1 px-1">
<input type="radio" 
@change="dlgComments = !dlgComments; setUpdateData(2, 3, flt.user_payment_id, flt.payment_amount, flt.pay_date, flt.email, flt.user_name, flt.due_concept, flt.payment_reference, flt.student_due_detail_id); sendInfo(flt)" 
:name="`filter${f}`" 
:checked="false">
</span>     
</v-col>
</v-row>

我对Vue还比较陌生，不知道应该添加哪个属性。谢谢，对不起我的英语！！！

Answer 1

1. 您需要在数据中添加一个密钥来管理无线电的检查状态，例如"isChecked"：

   data () {
   return {
   isChecked: true,
   }
   }
   

2. 将输入的检查状态绑定到数据属性：

<input type="radio":checked="isChecked">

3. 设置另一个按钮的点击事件，以切换/清除对更改数据属性的函数的检查(取决于您想要做什么((例如，我想要切换单选按钮(：

<button @click="toggleCheckedState">Toggle</button>

以及切换状态的功能(在方法中定义(：

methods:{
toggleCheckedState(){
this.isChecked = !this.isChecked; //example
//your logic
},
}