vue的单选下拉和复选下拉

Vue.js 中的单选下拉（Radio Select）和复选下拉（Checkbox Select）是常用的表单组件，它们用于让用户从选项列表中选择一项或多项。

1. **单选下拉** (Radio Select):
- 它是一种单选模式的选择，通常每个选项前都有一个勾选框，用户只能选择其中的一个。在Vue中，可以使用`v-model`指令绑定数据模型，`<radio>`标签配合`<template>`或`v-for`循环来创建一组单选按钮。例如：

     <div v-for="option in options">
       <input type="radio" :value="option.value" v-model="selectedOption">
       {{ option.label }}
     </div>

- 数据绑定到`selectedOption`，当用户点击某个选项时，只有那个选项会被选中，其他则变为未选中状态。

2. **复选下拉** (Checkbox Select):
- 这种模式允许用户选择多个选项，每个选项前面有一个可勾选的复选框。同样使用`v-model`绑定数据数组，`<checkbox>`标签配合循环展示。示例：

     <div v-for="option in options">
       <input type="checkbox" :value="option.value" v-model="selectedOptions">
       {{ option.label }}
     </div>

- `selectedOptions`是一个数组，存储用户选择的所有值。