toggle class
Example of toggling CSS class using v-bind, v-on:click and inline conditional statement.
<div id="app">
<button v-bind:class="{ 'toggled' : is_active }" v-on:click="toggle_class()">Toggle</button>
</div>
<script>
new Vue({
el: '#app',
data: {
is_active: false
},
methods: {
toggle_class(){
return this.is_active ? this.is_active = false : this.is_active = true
}
}
})
</script>
copy