ant-design-vue checkbox实现单选框

在 ant-design-vue 中，Checkbox 组件默认是多选框，如果要实现单选框，可以通过以下两种方式实现：

1. 使用 Radio.Group 组件

Radio.Group 组件可以实现单选框的效果，我们可以将多个 Radio 组件放在 Radio.Group 组件中，并设置相同的 name 属性，这样就可以实现单选框的效果了。

<template>
  <a-radio-group v-model="selected">
    <a-radio value="a">A</a-radio>
    <a-radio value="b">B</a-radio>
    <a-radio value="c">C</a-radio>
  </a-radio-group>
</template>

<script>
export default {
  data() {
    return {
      selected: 'a'
    }
  }
}
</script>

2. 通过 Checkbox 组件的 checked 属性实现单选框

我们可以通过控制 Checkbox 组件的 checked 属性来实现单选框的效果。在这种方式下，我们需要为每个 Checkbox 组件设置不同的 value 值，并且在选中某个 Checkbox 组件时，需要将其他 Checkbox 组件的 checked 属性设置为 false。

<template>
  <div>
    <a-checkbox :checked="selected === 'a'" @change="handleChange('a')">A</a-checkbox>
    <a-checkbox :checked="selected === 'b'" @change="handleChange('b')">B</a-checkbox>
    <a-checkbox :checked="selected === 'c'" @change="handleChange('c')">C</a-checkbox>
  </div>
</template>

<script>
export default {
  data() {
    return {
      selected: 'a'
    }
  },
  methods: {
    handleChange(value) {
      this.selected = value
    }
  }
}
</script>

以上两种方式都可以实现单选框的效果，具体使用哪种方式，可以根据实际情况进行选择。