https://github.com/rfberaldo/vue-checkbox-switch

A Vue component for checkbox's switch style
https://github.com/rfberaldo/vue-checkbox-switch

bulma checkbox-switch-style switch vue-checkbox-switch vue-components vuejs vuejs2

Last synced: 24 days ago
JSON representation

A Vue component for checkbox's switch style

• Host: GitHub
• URL: https://github.com/rfberaldo/vue-checkbox-switch
• Owner: rfberaldo
• License: mit
• Archived: true
• Created: 2017-03-08T19:03:17.000Z (almost 9 years ago)
• Default Branch: master
• Last Pushed: 2017-11-29T13:43:41.000Z (about 8 years ago)
• Last Synced: 2025-06-14T14:50:28.132Z (6 months ago)
• Topics: bulma, checkbox-switch-style, switch, vue-checkbox-switch, vue-components, vuejs, vuejs2
• Language: Vue
• Size: 6.84 KB
• Stars: 35
• Watchers: 1
• Forks: 13
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-vue-refactor - vue-checkbox-switch

README

          
# Vue Checkbox Switch

A simple Vue component for checkbox's switch style based on [vue-bulma/switch](https://github.com/vue-bulma/switch) and [this PR](https://github.com/jgthms/bulma/pull/544) on [Bulma](https://github.com/jgthms/bulma)

## Installation

**You don't need any dependencies** except Vuejs 2

Copy ``src/Switch.vue`` to your components folder

## Example

![Screenshot](https://github.com/rafaelpimpa/vue-checkbox-switch/blob/master/screenshot.png)

```vue

    Test

    import Switch from './components/Switch'

    export default {

        components: {

            'app-switch': Switch

        },

        data() {

            return {

                value: false,

                text: ''

            }

        },

        watch: {

            value(val) {

                this.text = val ? 'Yes' : 'No'

            }

        }

    }

```

---

> Twitter [@rafaelpimpa](https://twitter.com/rafaelpimpa)