vue3 获取复选框选中的值

在Vue 3中，如果你想要获取复选框（Checkbox）选中的值，通常会通过v-model指令来关联数据。当你在模板上设置`<input type="checkbox" v-model="selectedValue">`，`selectedValue`就是你在JavaScript中控制这个复选框状态的数据属性。

当选中的时候，`selectedValue`会被设置为true，未选中则为false。例如：

<!-- Vue组件示例 -->
<template>
  <div>
    <input type="checkbox" :value="true" v-model="checkboxValue">
    {{ checkboxValue }}
  </div>
</template>

<script>
export default {
  data() {
    return {
      checkboxValue: false, // 初始值设为false
    };
  },
};
</script>

在这个例子中，当用户点击复选框时，`checkboxValue`的值就会跟随复选框的状态变化。

如果你想获取数组中的所有已选复选框对应的值，可以使用对象字面量或者数组的方式，比如：

<template>
  <div>
    <input type="checkbox" v-model="options[0]" v-for="(option, index) in options">
    {{ option }} <!-- 这里直接显示选项值，如果需要编号可以用{{ index }} -->
  </div>
</template>

<script>
export default {
  data() {
    return {
      options: [/* 需要的选项数组 */],
    };
  },
};
</script>

此时，`v-model="options[index]"`会让每个复选框的值对应到`options`数组中的相应元素。