Vue Bootstrap Toggler
A simple Vue.js component to add a bootstrap style toggle. Using Vue data bindings to handle class changes and removing the need for jQuery dependency. This is based on the styles in Bootstrap Toggle.
Requirements
Installation
Install with npm
npm install --save-dev vue-bootstrap-toggler
Full example
<template>
<div>
<vue-bootstrap-toggler :options="{ on: 'Yiss', off: 'Nah' }" :disabled="false" @update="updatedValue" initialValue="toggleValue"></vue-bootstrap-toggler>
</div>
</template>
<script>
import vueBootstrapToggler from 'vue-bootstrap-toggler';
export default {
name: "YourComponentName",
components: {
vueBootstrapToggler
},
data() {
return {
toggleValue: true
}
},
methods: {
updatedValue(val) {
this.toggleValue = val;
}
}
}