Vue
HTML
<div id="app">
<div class="panel">
<div v-for="(entry, i) in entries">
<input type="checkbox" v-model="selected[i]">
<label>{{entry.name}}</label>
</div>
</div>
<div>selectedEntries === {{selectedEntries}}</div>
</div>
CSS
.panel {
background: #f8f8f8;
margin: 10px;
border-radius: 3px;
padding: 10px;
}
Vue
new Vue({
el: "#app",
data () {
return {
entries: [
{ id: 101, name: "bla" },
{ id: 243, name: "blabla" },
{ id: 322, name: "blablabla" },
],
selected: [true, true, true],
}
},
computed: {
selectedEntries () {
return this.entries.filter((x, i) => this.selected[i])
}
}
})