Vuejs checkboxes

Posted 9 years ago - updated 9 years ago vuejs

Simple

<input type="checkbox" id="checkbox" v-model="checked">
<label for="checkbox">{{ checked }}</label>

Check method

<div v-repeat="tier: tiers">
        {{tier.value}} <input type="checkbox" v-model="check(tier.value)">
</div>

new Vue({
el: 'body',
data: {
    selected: [1, 3],
    tiers: [
        { value: 1 },
        { value: 2 },
        { value: 3 }
    ]
},
methods: {
    check: function(val){
        for (var i=0; i<this.selected.length; i++)
            if (this.selected[i] == val)
                 return true;
        return false;
    }
}
})

source

If condition is true

 <input type="checkbox" :checked="time.opening_time.length == 0 && time.closing_time.length == 0">

Calling a method on change

<input type="checkbox" v-model="time.is_open" v-on:change="checkTime(time)">