Vue.js 中使用 a-radio 实现单选功能：即使使用 td 单元格隔开也能保证选中一项

如何实现就算用td单元格隔开，a-radio依然能保证选中某项，其他项取消选中内容：要实现即使使用了<td>单元格进行隔开，也能保证只有某一项被选中，其他项取消选中，可以使用v-model指令来绑定选中项的值。

首先，给每个<a-radio>组件添加一个v-model指令，将其值绑定到一个变量（比如selectedValue）上，表示当前选中的项。

<template v-for="children in record[0].children" :key="children.value">
  <td colspan="2" class="col1">
    <a-radio v-if="children.value !== 'xx'" v-model="selectedValue" :value="children.value" />
    <span>{{children.title}}</span>
  </td>
</template>

然后，在data中定义selectedValue变量，并初始化为默认选中的项的值。

data() {
  return {
    selectedValue: '默认选中项的值'
  }
}

这样，无论<a-radio>组件是否被<td>单元格分隔，只要selectedValue的值改变，对应的<a-radio>组件就会被选中，其他项则会取消选中。