vue3中，点击单选框显示内容，取消单选框不显示内容

你可以通过绑定单选框的 `v-model` 指令来实现该功能。当单选框被选中时，`v-model` 绑定的变量会被设置为单选框的 value 值，此时你可以在页面中显示对应的内容。当单选框被取消选中时，`v-model` 绑定的变量会被重置为 null 或者 undefined，此时你可以隐藏对应的内容。

以下是一个基本的示例：

<template>
  <div>
    <label>
      <input type="radio" value="option1" v-model="selectedOption"> Option 1
    </label>
    <label>
      <input type="radio" value="option2" v-model="selectedOption"> Option 2
    </label>

    <div v-if="selectedOption === 'option1'">
      Option 1 is selected
    </div>
    <div v-if="selectedOption === 'option2'">
      Option 2 is selected
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      selectedOption: null
    }
  }
}
</script>

在上面的示例中，当选中单选框时，`selectedOption` 的值会被设置为对应的 value 值（`'option1'` 或者 `'option2'`），此时对应的内容会被显示出来。当取消选中时，`selectedOption` 的值会被重置为 `null`，对应的内容会被隐藏。