im wanna to bind model to QSelect with checkbox,
but when binding model to QSelect checkbox not checked.
this is my code:
data() {
return {
selectModel: [],
selectOptions: [
{
label: 'Google',
value: 1
},
{
label: 'Facebook',
value: 2
},
{
label: 'Twitter',
value: 3
},
{
label: 'Apple',
value: 4
},
{
label: 'Oracle',
value: 5
}
],
};
},
and button event to binding QSelect
onBindCheckedSelect() {
this.selectModel= [
{
label: 'Twitter',
value: 3
},
{
label: 'Apple',
value: 4,
},
]},
and this is my html code
<div class="q-pa-md" style="max-width: 300px">
<div class="q-gutter-md">
<q-badge color="secondary" multi-line>
Model: "{{ model }}"
</q-badge>
<q-select
filled
v-model="selectModel"
:options="selectOptions"
label="Multi with toggle"
multiple
emit-value
map-options
>
<template v-slot:option="scope">
<q-item
v-bind="scope.itemProps"
v-on="scope.itemEvents"
>
<q-item-section>
<q-item-label v-html="scope.opt.label" ></q-item-label>
</q-item-section>
<q-item-section side>
<q-checkbox v-model="selectModel" :val="scope.opt.value" />
</q-item-section>
</q-item>
</template>
</q-select>
</div>
</div>
but its not working and selected item not checked