vue.js toggle button code example
Example 1: toggle on-click button vue
<button @click="variable = !variable">
Toggle Value
</button>
<script>
export default {
data () {
return {
variable: false
}
}
}
</script>
Example 2: vue-js-toggle-button config
<template> <div class="container" style="text-align:center"> <div class="large-12 medium-12 small-12 cell"> <h1 style="font-family:ubuntu">Vue js toggle button example - ItSolutionStuff.com</h1> <toggle-button @change="onChangeEventHandler" :labels="{checked: 'On', unchecked: 'Off'}" style="margin-left: 20px" /> <toggle-button :labels="{checked: 'Itsolutionstuff.com', unchecked: 'HDTuto.com'}" width="150" style="margin-left: 20px" /> <toggle-button :labels="{checked: 'Yes', unchecked: 'No'}" style="margin-left: 20px" /> </div> </div></template> <script> export default { data(){ return { file: '' } }, methods: { onChangeEventHandler(){ alert('hi'); } } }</script>