Checkbox
LvCheckbox component can be used in projects where a way is required for user to select or deselect an option.
# Playground
#Basic
You can use the checkbox with various predefined colors by passing them in color prop, avaliable colors are sucess,warning,primary,info,danger. You can set the corners of checkbox to round by setting rounded prop to true.You can change the appearance of checkbox through thick,filled,plain,smooth. LightVue checkbox is Both compatible with Vue 2.x and Vue 3.x
#With Animations
You can use the checkbox with various predefined Transitions by setting smooth,pulse props to true
#Radio
You can use the checkbox component as a Radio by setting type prop to radio all the other variations you use with the checkbox you can use them with radio also in the same way
#Disabled
You can use the checkbox to Disable by passing disabled prop to true
#With Icons
You can use the icons with checkbox by passing then in the slot and setting icon prop to true
#Scalable sizes
You can set the checkbox size by wrapping it inside a element
#Setup
You can import a component and register it as a local and global vue component as follows:
// import the component
import LvCheckBox from 'lightvue/CheckBox';
// Register the component locally
export default {
components: {
LvCheckBox
}
}
// Register the component globally (Vue 2.x)
Vue.component('LvCheckBox', LvCheckBox);
// Register the component globally (Vue 3.x)
const app = Vue.createApp({
// ...
});
app.component('LvCheckBox', LvCheckBox);
app.mount('#app')
#APIs
All of the props, events and slots of the component are mentioned below: