Checkbox
When To Use
- Used for selecting multiple values from several options.
- If you use only one checkbox, it is the same as using Switch to toggle between two states. The difference is that Switch will trigger the state change directly, but Checkbox just marks the state as changed and this needs to be submitted.
TIP
This component fully supports Checkbox component attribute of ant design
Examples
<template>
<h-checkbox v-model:value="value1" :options="options" :save-options="{autoSave:true,key:'checkbox-input'}" />
</template>
<script setup lang="ts">
import { ref } from 'vue';
const value1 = ref([]);
const options = [
{ label: 'Apple', value: 'Apple' },
{ label: 'Pear', value: 'Pear' },
{ label: 'Orange', value: 'Orange' },
];
</script>
API
Props
| Property | Description | Type | default |
|---|---|---|---|
| saveOptions | Automatically upload and initialize component data. Note ⚠️: Multiple key values under the same tool need to be unique. | object | autoSave:false,key:"" |