<template>
  <h1>复选框(默认值false)</h1>

  <div>
    <div>
      <Checkbox
        v-model:value="value1"
        name="value1"
      />
    </div>

    <div>
      {{ value1 }}
    </div>
  </div>


  <h1>复选框(默认值true)</h1>

  <div>
    <div>
      <Checkbox
        v-model:value="value2"
        name="value2"
      />
    </div>

    <div>
      {{ value2 }}
    </div>
  </div>



  <h1>复选框(只读)</h1>

  <div>
    <div>
      <Checkbox
        :disabled="true"
        name="value2"
      />
    </div>

    <div>
      {{ value2 }}
    </div>
  </div>

  <h1>复选框(必填)</h1>

  <div>
    <div>
      <Checkbox
        :required="true"
        name="value2"
      />
    </div>

    <div>
      {{ value2 }}
    </div>
  </div>
</template>


<script>
import { defineComponent, ref } from 'vue';

import Checkbox from '@/checkbox/src/Checkbox.vue';

export default defineComponent({

  components: {
    'Checkbox': Checkbox,
  },
  setup() {
    const value1 = ref(false);
    const value2 = ref(true);
    return {
      value1, value2,
    };
  },
});
</script>
