I'm having trouble with v-model in vue multiselect. Multiselect requires an object to be passed into v-model to have an initial selected value so it can match that object with the options Object. Here is a sample of my code:
<b-tr v-for="(income, index) in this.incomes" :key="income.id">
<b-td>
<multiselect
:options="selectAccount"
v-model="{id:income.account_id,account:income.accounts.account}"
label="account"
track-by="id"
></multiselect>
</b-td>
</b-tr>
Vue does not accept passing an Object into v-model this way and I can't figure out another way to do this.
Here is the incomes Object:
incomes: Array
0: Object
account_id:
accounts: Object
account:
id:
amount:
id:
date:
Options:
options: Array[3]
0: Object
account:
id:
You can make v-model related to an array that you pass each element by index of main array like:
v-model="selected_options[index]"
and set selected_value as an array:
selected_options: []
Can't use v-model
with multiple values:
"Component v-model is designed for single value input components that attend to similar use cases for native input elements.
For a complex component that manages the synchronization of more than one values, explicit prop/event pairs is the proper solution. In this particular case I don't think the saved keystrokes are worth the added complexity of additional syntax."
PS. Support for multiple values with v-model
is coming in Vue v3 at the end of Q1/20, with syntax like v-model:id="income.account_id"
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.