toggle-switch-button-vue
toggle-switch-button-vue
VUE-3
No Dependency only single vue component file
A vue component with two way binding via v-model a boolean value toggle true/false
also label property shows label on button with '|' separated. As "ON|OFF"
Properties
| props | type | default | description |
|---|---|---|---|
| v-model | Boolean | false | two way binding that toggle value true/false |
| label | string | pipe separated value "ON|OFF" | |
| className | string | "toggle-switch-button" | custom css class name to change the UI layout |
How to Install
copy following code and run on CLI
npm install toggle-switch-button-vue
How to use
Example Code
usase
template sectioln
<div>
<ToggleSwitchButton v-model="this.isActive" label="ON|OFF" />
</div>
<h1>{{ isActive }}</h1>
script section
import ToggleSwitchButton from "toggle-switch-button-vue";
components section
components: {
ToggleSwitchButton
},
data section
data() {
return {
isActive: true
};
},
methods section
methods: {
}