vue 多选框 代码

下面是一个简单的 Vue 多选框组件的示例代码：

<template>
  <div>
    <h3>{{ title }}</h3>
    <ul>
      <li v-for="option in options" :key="option.value">
        <label>
          <input type="checkbox"
                 :value="option.value"
                 v-model="selectedOptions">
          {{ option.label }}
        </label>
      </li>
    </ul>
    <p>You have selected: {{ selectedOptions }}</p>
  </div>
</template>

<script>
export default {
  name: 'MultiCheckbox',
  props: {
    title: {
      type: String,
      required: true
    },
    options: {
      type: Array,
      required: true
    }
  },
  data() {
    return {
      selectedOptions: []
    }
  }
}
</script>

上面的代码使用了 props 传递了标题和选项数组，然后使用 v-for 指令在模板中渲染多个复选框。使用 v-model 指令将选中的值绑定到组件的 data 中，然后在模板中展示选中的值。