I'm struggling to get checkboxes to work with Vuex. I have setup an example in this Codepen.
I have defined my checkboxes like this:
<v-checkbox
v-for="(item, idx) in $store.state.checkboxes"
:key="item.id"
:label="`Checkbox ${idx + 1}: ${item.name} [${checkboxes[idx].selected}]`"
:value="{ name: item.name, id: item.id, clicked: true }"
v-model="checkboxes"
>
</v-checkbox>
And these are the accompanying computed get
and set
:
computed: {
checkboxes: {
set(val){
console.log('checkboxes::set::val', val)
console.log('checkboxes::set::state', this.$store.state)
const triggeredBy = val.pop()
console.log('checkboxes::set::triggeredBy', triggeredBy)
this.$store.commit('updateCheckbox', triggeredBy)
},
get() {
console.log('checkboxes::set::get')
return this.$store.state.checkboxes
}
}
}
The get
and set
get called, but the set
changes all checkboxes on the first click and on the second click the val
is null.
I hope someone has time to have a look at it and point me in the right direction.
Thx!
Aucun commentaire:
Enregistrer un commentaire