vue项目中 使用多选框组件 <template> <SeptCheckbox :direction='true' v-model='data'></SeptCheckbox> </template> <script> export default { data() { return { data: [ { value: "beijing", label: "北京市", check: false }, { value: "shanghai", label: "上海市", check: false, disabled:true }, { value: "shenzhen", label: "深圳市", check: false }, { value: "hangzhou", label: "杭州市", check: false }, { value: "nanjing", label: "南京市", check: false }, { value: "chongqing", label: "重庆市", check: false } ],}}} </script>旁边>选中几个 旁边信息就提示选中几个 该怎么写

你可以在模板中加入一个计算属性，用来计算被选中的选项个数，然后在页面上展示出来。代码可以像下面这样写：

<template>
  <div>
    <SeptCheckbox :direction='true' v-model='data'></SeptCheckbox>
    <p>已选中 {{ checkedCount }} 个选项</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      data: [
        {
          value: "beijing",
          label: "北京市",
          check: false
        },
        {
          value: "shanghai",
          label: "上海市",
          check: false,
          disabled: true
        },
        {
          value: "shenzhen",
          label: "深圳市",
          check: false
        },
        {
          value: "hangzhou",
          label: "杭州市",
          check: false
        },
        {
          value: "nanjing",
          label: "南京市",
          check: false
        },
        {
          value: "chongqing",
          label: "重庆市",
          check: false
        }
      ],
    };
  },
  computed: {
    checkedCount() {
      return this.data.filter(item => item.check).length;
    }
  }
};
</script>

这样，在选中选项的时候，页面上就会展示出已选中的选项个数。