Hi everybody!
I’ve been dealing with an issue, and I’m not being able to understand what’s going on. I’m kinda new to Quasar and maybe I don’t understand the whole workflow… but I have searched the web for a few hours now, and found no answer… Hope somebody can help me.
I have a simple QSelect element, that uses a v-model inside an array… (I need this because I’m loading an unknown list of elements inside a form).
<q-select
label="TestSelect"
v-model="testModel['test']"
:options="options"
filled
class="q-ma-md q-mt-lg">
</q-select>
data: function () {
return {
testModel: [],
options: [
{
label: 'Google',
value: 'goog'
},
{
label: 'Facebook',
value: 'fb'
},
{
label: 'Twitter',
value: 'twtr'
},
{
label: 'Apple Inc.',
value: 'appl'
},
{
label: 'Oracle',
value: 'ora'
}
]
}
}
The QSelect works as expected.
But, if during completed() or mounted() I set a default value for the QSelect, it stops working. It doesn’t update with the selected value.
mounted: function () {
this.testModel['test'] = 'goog'
}
I found that if I add another value to the DOM and update that value, the QSelect gets updated as well with the last selected option.
I made a codepen illustrating the situation: https://codepen.io/smaldona/pen/gObMYBY
Any help or guidance will be greatly appreciated.
Thanks in advance!